[JQUERY] 어떻게 맨 위로 점프에서 '#'링크를 클릭을 방지하기 위해?

어떻게 맨 위로 점프에서 '#'링크를 클릭을 방지하기 위해?

해결법

1. ---

   1.당신은 클릭 이벤트를 처리 할 때 jQuery를에, 일반적인 방법으로 응답에서 링크를 중지 false를 반환 방지 (PoweRoy의 의견과 에릭의 대답은 당) 일어나고에서 HREF 특성을 방문하는 것입니다 기본 동작 :

   당신은 클릭 이벤트를 처리 할 때 jQuery를에, 일반적인 방법으로 응답에서 링크를 중지 false를 반환 방지 (PoweRoy의 의견과 에릭의 대답은 당) 일어나고에서 HREF 특성을 방문하는 것입니다 기본 동작 :

   $('a.someclass').click(function(e)
   {
       // Special stuff to do when this link is clicked...
   
       // Cancel the default action
       e.preventDefault();
   });
   

2. ---

   2.그래서 누군가가 검색이 발견 단지의 경우 ... 오래지만.

   그래서 누군가가 검색이 발견 단지의 경우 ... 오래지만.

   그냥 대신 "#"의 "#을 /"를 사용하여 페이지를 이동하지 않습니다.

3. ---

   3.당신은 그냥이처럼 쓸 수 있습니다 :

   당신은 그냥이처럼 쓸 수 있습니다 :

   <a href="javascript:void(0);"></a>
   

   그것의 더 나은 방법이 확실하지 메신저하지만 방법입니다 :)

4. ---

   4.

   <a href="#!" class="someclass">Text</a>
   

   <a href="javascript:void(0);" class="someclass">Text</a>
   

   <a href="#" class="someclass">Text</a>
   <script>
   $('a.someclass').click(function(e) {
       e.preventDefault();
   });
   </script>
   

5. ---

   5.이 작업을 피하기 위해에서는 event.preventDefault ()를 사용할 수 있습니다. 자세한 내용은 여기 읽기 : http://api.jquery.com/event.preventDefault/합니다.

   이 작업을 피하기 위해에서는 event.preventDefault ()를 사용할 수 있습니다. 자세한 내용은 여기 읽기 : http://api.jquery.com/event.preventDefault/합니다.

6. ---

   6.원하는 경우 그냥 사용 <입력 유형 = "버튼"/> 대신 및 사용 CSS 스타일로는 링크처럼 보이게합니다.

   원하는 경우 그냥 사용 <입력 유형 = "버튼"/> 대신 및 사용 CSS 스타일로는 링크처럼 보이게합니다.

   버튼 클릭을 위해 특별히 만들어진, 그들은 어떤 HREF 속성이 필요하지 않습니다.

   당신이를 통해 자바 스크립트, 그래서 자바 스크립트 비활성화와, 그들이 모두에 표시되지 않습니다 필요하고 사용자를 혼동하지 않는 경우 가장 좋은 방법은 버튼을 생성하기위한 조치를 온로드 사용을 추가하는 것입니다.

   당신은 HREF는 = 사용할 때 "#"당신은 에이전트가 자바 스크립트를 지원하지 않는 것없는 작업 같은 위치에 가리키는 링크의 톤을 얻을.

7. ---

   7.당신이 앵커를 사용하려면 당신은 제안 다른 답변처럼 http://api.jquery.com/event.preventDefault/를 사용할 수 있습니다.

   당신이 앵커를 사용하려면 당신은 제안 다른 답변처럼 http://api.jquery.com/event.preventDefault/를 사용할 수 있습니다.

   또한 기간과 같은 다른 요소를 사용하고에 클릭 이벤트를 첨부 할 수 있습니다.

   $("span.clickable").click(function(){
   alert('Yeah I was clicked');
   });
   

8. ---

   8.0의 ID가 허용되지 않기 때문에 당신은 HREF로 # 0을 사용할 수있는 페이지가 이동하지 않습니다.

   0의 ID가 허용되지 않기 때문에 당신은 HREF로 # 0을 사용할 수있는 페이지가 이동하지 않습니다.

   <a href="#0" class="someclass">Text</a>
   

9. ---

   9.

   $('a[href="#"]').click(function(e) {e.preventDefault(); });
   

10. ---

    10.그냥 사용

    그냥 사용

    <a href="javascript:;" class="someclass">Text</a>
    

    JQUERY

    $('.someclass').click(function(e) { alert("action here"); }
    

11. ---

    11.요소가 의미있는 HREF 값이없는 경우, 정말 링크 아니다, 왜 대신 다른 요소를 사용하지?

    요소가 의미있는 HREF 값이없는 경우, 정말 링크 아니다, 왜 대신 다른 요소를 사용하지?

    제대로 스타일의 경우 Neothor에 의해 제안, 스팬 그냥 적절하고, 클릭 할 수있는 항목으로 눈에 띄게 명백 할 것이다. 당신은 그 위에 사용자의 마우스 이동으로 elemnt '라이트 업'을하게하기 위해, 호버 이벤트를 첨부 할 수 있습니다.

    그러나,이, 당신은 자바 스크립트없이 기능 있도록 사이트의 디자인을 재고 할 수 있지만 사용할 수있을 때 자바 스크립트에 의해 강화되는 것을 특징으로 한.

12. ---

    12.HREF와 링크는 거의 항상 버튼 요소로 대체해야 "#"을 = :

    HREF와 링크는 거의 항상 버튼 요소로 대체해야 "#"을 = :

    <button class="someclass">Text</button>
    

    "- 텍스트 링크"하지만 사용자가 클릭하는 경우는 아무데도 가지 않을 것이다 HREF =와 링크를 사용하여 "#"는이 링크 밖으로 읽을 화면 판독기에 표시됩니다으로 접근성 우려도있다.

13. ---

    13.자바 스크립트없이 정상에 점프에서 페이지를 방지하기 위해 4 개 유사한 방법이 있습니다 :

    자바 스크립트없이 정상에 점프에서 페이지를 방지하기 위해 4 개 유사한 방법이 있습니다 :

    옵션 1:

    <a href="#0">Link</a>
    

    옵션 2 :

    <a href="#!">Link</a>
    

    옵션 3 :

    <a href="#/">Link</a>
    

    옵션 4 (권장하지 않음)

    <a href="javascript:void(0);">Link</a>
    

    그러나 당신이 jQuery를에 클릭 이벤트를 전달하는 경우 ()에서는 event.preventDefault를 사용하는 것이 좋습니다.

14. ---

    14.당신은 단지 HREF 특성없이 앵커 태그를 통과하고 필요한 조치를 할 jQuery를 사용할 수 있습니다 :

    당신은 단지 HREF 특성없이 앵커 태그를 통과하고 필요한 조치를 할 jQuery를 사용할 수 있습니다 :

    바 를

15. ---

    15.내가 사용하고 있습니다 :

    내가 사용하고 있습니다 :

    <a href="javascript://nop/" class="someClass">Text</a>
    

16. ---

    16.# / 트릭은 작동하지만, 브라우저에 기록 이벤트를 추가합니다. 그래서, 다시 클릭하면 사용자가 / 원하는에 예상을했던 것으로서하지 작업을 수행합니다.

    # / 트릭은 작동하지만, 브라우저에 기록 이벤트를 추가합니다. 그래서, 다시 클릭하면 사용자가 / 원하는에 예상을했던 것으로서하지 작업을 수행합니다.

    $ ( '신체')을 클릭 ( "[HREF ="# "] A '를, 함수 (E) {e.preventDefault ()}).; 이미 기존의 콘텐츠를 작동하고, 어떤 요소가 부하 후 DOM에 추가로 내가 갔던 길이다.

    내가했던, 그래서 특히, I는 .btn 그룹 (참조)의 부트 스트랩 드롭 다운 메뉴 내에서이 작업을 수행하는 데 필요한 :

    $ ( '신체')을 클릭 (함수 (E) {e.preventDefault ()} "드롭 다운 메뉴의 리튬이 [HREF ="# "를].. ');

    이 방법은 대상이되고, 페이지에 다른 어떤 일에 영향을 미치지 않았다.

17. ---

    17.난 항상 사용했습니다 :

    난 항상 사용했습니다 :

    <a href="#?">Some text</a>
    

    페이지 점프를 방지하려고 할 때. 확실하지 않음이 최고입니다, 그러나 그것은 년 동안 잘 작동하고있는 것 같으면.

18. ---

    18.또한 jQuery를 처리 한 후 거짓을 반환 할 수 있습니다.

    또한 jQuery를 처리 한 후 거짓을 반환 할 수 있습니다.

    예.

    $(".clickableAnchor").live(
        "click",
        function(){
            //your code
            return false; //<- prevents redirect to href address
        }
    );
    

19. ---

    19.나는 이런 식으로 뭔가를 사용 :

    나는 이런 식으로 뭔가를 사용 :

    <a href="#null" class="someclass">Text</a>
    

20. ---

    20.점프에서 페이지를 방지, 당신은 e.stopPropagation ()를 호출해야합니다; ()를 호출 한 후 e.preventDefault ;:

    점프에서 페이지를 방지, 당신은 e.stopPropagation ()를 호출해야합니다; ()를 호출 한 후 e.preventDefault ;:

    인 stopPropagation는 DOM 트리를가는 경우를 방지 할 수 있습니다. 여기에 더 많은 정보 : https://api.jquery.com/event.stoppropagation/

21. ---

    21.당신이 사용하는 최대 페이지 점프하지 않고 동일한 페이지에 앵커 섹션으로 이주하려는 경우 :

    당신이 사용하는 최대 페이지 점프하지 않고 동일한 페이지에 앵커 섹션으로 이주하려는 경우 :

    그냥 대신 "#"의 "#을 /"를 사용 예컨대

    <a href="#/home">Home</a>
    <a href="#/about">About</a>
    <a href="#/contact">contact</a> page will not jump up on click..
    

22. ---

    22.# 이후에 뭔가를 추가하면 해당 ID를 가진 요소에 페이지의 초점을 설정합니다. 간단한 솔루션은 jQuery를 사용하는 경우에도 / #을 사용하는 것입니다. 그러나 당신은) jQuery를,에서는 event.preventDefault (의 이벤트를 처리하는 경우 길을 가야하는 것입니다.

    # 이후에 뭔가를 추가하면 해당 ID를 가진 요소에 페이지의 초점을 설정합니다. 간단한 솔루션은 jQuery를 사용하는 경우에도 / #을 사용하는 것입니다. 그러나 당신은) jQuery를,에서는 event.preventDefault (의 이벤트를 처리하는 경우 길을 가야하는 것입니다.

23. ---

    23.은 링크 및 하나 .. 그것은 단지 소요 번 이상 동일한 입력을 클릭하는 경우 작동하지 않습니다 에 링크 1 개 이벤트에 여러 개의 입력에 각각 클릭합니다.

    은 링크 및 하나 .. 그것은 단지 소요 번 이상 동일한 입력을 클릭하는 경우 작동하지 않습니다 에 링크 1 개 이벤트에 여러 개의 입력에 각각 클릭합니다.

    아직도 갈 수있는 가장 좋은 방법은 링크 을 함께

    그때,

    event.preventDefault();
    

from https://stackoverflow.com/questions/3252730/how-to-prevent-a-click-on-a-link-from-jumping-to-top-of-page by cc-by-sa and MIT license