“javascript : void (0);”

“javascript : void (0);” vs "return false"vs "preventDefault ()"

---

일부 링크가 아무것도하지 않고 자바 펼쳐 작업에만 응답하기를 원할 때 링크가 페이지 상단 가장자리로 스크롤되는 것을 방지하는 가장 좋은 가장자리 방법은 무엇입니까?
나는 여러 가지 방법을 알고 있으며 모두 잘 작동하는 것입니다.

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

또는

<a id="hello" href="#">Hello</a>
<script type="text/javascript>
  $(document).ready(function() {
    $("#toto").click(function(){
      //...
      return false;
    });
  });
</script>

심지어 :

<a id="hello" href="#">Hello</a>
<script type="text/javascript>
  $(document).ready(function() {
    $("#toto").click(function(event){
      event.preventDefault();          
      //...
    });
  });
</script>

선호하는 염기 서열? 왜? 어떤 조건에서?

추신 : 물론 위의 예제는 jquery를 사용하고 가정하지만 mootools 또는 타입에 해당하는 것이 있습니다.

---

제본 :

• javascript: URL은 항상 피해야 할 공포입니다.
• 인라인 이벤트 속성도 훌륭하지만 약간의 빠른 개발 / 테스트에는 괜찮습니다.
• 펼쳐서 바인딩하고 마크 업을 깨끗하게 유지하는 것이 일반적으로 모범 사례로 작성됩니다. jQuery는 권장하지만 어떤 라이브러리도 일반 JS에서 할 수없는 이유는 없습니다.

응답 :

• jQuery에서 및 return false모두 의미가있는 이벤트 알림을받는 부모 요소에 관심이 있다는 의미가 있습니다.preventDefaultstopPropagation
• jQuery는 여기에 숨겨져 달라야합니다 preventDefault/ stopPropagation일반적으로 IE에서 철자가 필요합니다 ( returnValue/ cancelBubble).

하나 :

• 링크가 아닌 링크가 있습니다. 아무데도 연결되지 않았습니다. 그것은 행동입니다. <a>이것에 대한 장식 마크 업은 아닙니다. 누군가가 그것을 중간 클릭하거나 책갈피에 추가하거나 링크에있는 다른 어포던스에 추가하려고하거나 할 것입니다.
• 페이지의 다른 요소를 열거 나 닫을 때와 같이 바로 거기에서 바로 링크를 가리 키도록 설정하고 #thatelementsid눈에 띄지 않는 스크립팅을 사용하여 링크 이름에서 요소 ID를 가져옵니다. 또한 location.hash문서로드시 스니핑하여 해당 요소를 열 수 있으므로 링크가 다른 기업에서 유용합니다.
• 이름 순전히 액션 인 경우 다음과 같이 표시하는 것이 좋습니다. <input type="button">또는 <button type="button">. 원하는 경우 버튼 대신 링크처럼 보이도록 CSS로 스타일을 이용할 수 있습니다.
• 그러나 IE와 Firefox에서는 제거 할 수없는 버튼 스타일의 몇 가지 사항이 있습니다. 으로 중요하지 일반적 않지만 절대적인 시각적 제어가 필요한 경우 <span>대신 사용하는를 것이 좋습니다. tabindex속성을 추가하여 대부분의 브라우저에서 키보드로 액세스 할 수 있습니다. 활성화 광고 공백 또는 Enter와 같은 키 누름을 감지 할 수도 있습니다. 이 불만족 스럽지만 여전히 꽤 인기가 있습니다.
• 또 다른 가능성은 <input type="image">. 당신의 손쉬운 버튼을 누르세요.

---

제가 생각할 수있는 유일한 장점 javascript:void(0)은 가장 오래된 것입니다. 즉, 언급 한 다른 눈에 띄지 않는 접근 방식 중 하나를 사용합니다 .

• 대부분의 용도를 위해, event.preventDefault()그리고 return false상호 교환 사용할 수 있습니다.

• event.preventDefault()원하는대로 페이지가 다시로드되지 않도록해야하지만, 버블 링 이벤트가 상위 항목으로 링할 수 있습니다. 버블 링을 중지하고 함께 사용할 수 있습니다 event.stopPropagation.
• return false 추가로 이벤트가 부모에게 버블 링되는 것을 중지합니다.

저는 위의 첫 번째 요점에서 '교환 가능하게'라고 말 했어요. 대부분의 경우 이벤트가 부모에게 거품이 있든 상관하지 않습니다. 그러나 미세 조정이 필요한 경우 에는 포인트 2와 3을 고려해야합니다.

다음 예를 고려하십시오.

<div>Here is some text <a href="www.google.com">Click!</a></div>​

$("a").click(function(e) {
    e.preventDefault();
});

$("div").click(function() {
    $(this).css("border", "1px solid red");
});
​

앵커를 클릭하면 이벤트의 기본 동작이 트리거되지 않은 브라우저가 www.google.com으로 리디렉션되지 않습니다. 그러나 이벤트는 여전히 '버블 링'되고 div의 클릭 이벤트가 발생하여 주변에 추가됩니다. 추가 e.stopPropagation() 또는 그냥 return false div의 클릭 이벤트가 발생하지 않습니다. 여기에서 엉망으로 만들 수 있습니다 : http://jsfiddle.net/cMKsN/1/

---

Dreamweaver는 기본적으로 사용하기 사용하기 때문에 멋진 트릭을 사용합니다.

<a href='javascript:;'></a>

고정이고 도서관에 구애받지 않고 도서관에 있습니다.

---

을 사용하는 것을 선호 return false합니다. 여기에 있는지 여부와 같이 quirksmode에서 해당 작업을 계속할지 여부를 사용자에게 선택할 수있는 옵션을 제공하기 때문입니다.

http://www.quirksmode.org/js/events_early.html#default

간단하고 오래 작동 자바 버전에 관계없이 브라우저 간 잘 작동합니다.

---

event.preventDefault()그리고 return false;한 가지-(클릭 된 앵커 태그의 HREF로 이동,이 경우) 이벤트에 대한 기본 동작을 처리하지 않도록 브라우저를 지시합니다. href=javascript:그리고 그것의 ilk는 다른 것입니다-그들은 기본 동작을 '아무것도하지'로 만듭니다.

스타일의 문제입니다. onclick에서 모든 작업을 수행하고 싶거나, 아니면 onclick과 href 모두에 작업을 수행하고 브라우저의 기능에 의존하여 둘 사이를 조정하고 싶습니까?

---

나는 href="javascript:void(0)"링크에서 사용 #하는 것이 페이지의 맨 위로 점프한다는 것이 의미하며, 어떤 경우에는 jQuery가로드되지 않는 경우 (예 : jQuery가로드되지 않는 경우) 있습니다.

또한 event.preventDefault();false를 반환하기 전에 오류가 발생하더라도 링크를 따르지 않기 때문에 사용 합니다. 예를 들면 :

HTML :

<a id="link" href="http://www.google.com">Test</a>

jQuery 예제 1 :

$("#link").click(
    function(){
        alert("Hi");
        invalidCode();
        return false;
    }
);

jQuery 예제 2 :

$("#link").click(
    function(event){
        event.preventDefault();
        alert("Hi");
        invalidCode();
        return false;
    }
);

때문에 invalidCode();오류가 발생한다이 return false도달하지 않습니다 및 jQuery를 예 1을 사용하는 경우 사용자는 자신이하지 않습니다 예 2 jQuery를에 반면 구글로 리디렉션됩니다.

---

javascript :; 웹이 발전함에 따라 사용 가능한 트릭을 추적하기가 어렵습니다. 그러나 이것은 주로 접근성에 관한 것입니다 (javascript : void (0);). 그리고 작은 수정은 javascript : void (0)이 아닙니다. 하지만 javascript : void (0); 이는 false를 반환하는 것만 큼 아무것도하지 않음을 의미합니다. javascript : return false인지 확실하지 않지만 똑같아요 ..

나는 항상 사용하고 javascript : void (0); 몇 가지 이유 때문에 .. 물론 내 겸손한 의견으로는.

1.) 위에서 언급 한 사람과 똑같기 때문에 사용합니다 .. href = "#"는 정상으로가는 것을 의미 할 수 있고 그 경우에도 '#top'이 더 적합 할 것이므로 적절하지 않습니다. 그러나 이것은 또한 # (해시)를 사용하는 코드에서 다른 것을 유발할 수 있으므로 또 다른 이유는 #을 사용하는 다른 자바 스크립트와의 충돌을 피하는 것입니다. 그리고 예를 들어 플러그인을 사용할 때 이것을 찾아서 즉시 교체하는 경향이 있습니다. href = '#'to href = 'javascript : void (0);' 또는 href = 'javascript :;'

2.) 특정 Anchor 태그 그룹에 대한 함수를 재사용하려면 클릭 이벤트 감지 및 기본 동작 방지에 대한 걱정없이 모든 속성에 대해 selector를 사용하여 호출 할 수 있습니다. 개발 환경 설정으로.

3.) 대부분의 경우 javascript : void (0); 이전 href = rel = nofollow와 같이 추적되지 않도록 링크를 만들려고하므로 작업 인 링크 인덱싱을 방지합니다. 크롤러와 로봇이 이제 Flash도 읽을 수 있다고 들었 기 때문에 이것에 대해 잘 모르겠습니다. 자바 스크립트 링크를 읽을 수 있어도 놀라지 않을 것입니다.

4.) 참조 2.) 같은 클래스를 대상으로하고 a href = "javascript : void (0);"를 사용하여 클릭 이벤트 기본 동작을 방지하는 것을 잊어 버릴 수 있습니다. 그런 다음 jQuery 함수의 선택기에서 직접 클래스를 대상으로 지정합니다.

        jQuery(function($)
        {
            //from the rel
            $('a[rel="-your-rel-id"]') ... off('click').on('click',function()

            //from the class
            $('a.-the-class') ... off('click').on('click',function()

            //from the id

            $('a#-the-id').off('click').on('click',function()
            {
            --do something with this link
        });

}); 

나는 당신이 항상 할 수있는 것처럼 수업을 사용하는 것이 더 편하다고 느낍니다.

$ (a # -your-id) .hasClass (-yourclass-)

또는 다른 흥미로운 조합과 많은 링크에 영향을 미치므로 A를 선택 자로 만 사용하는 것은 권장하지 않습니다 ..

일반적으로 여기에서 제안하는 내용은 다음과 같습니다.

  jQuery(function($)
        {
            //from the rel
            $('a[rel="-your-rel-id"]').on('click',function(event)
            //do something
            //prevent the click as is passed to the function as an event
            event.preventDefault();
        });

});

---

나는 href그것이 의미하는 바가 아니기 때문에 JavaScript를에 넣지 않고 싶습니다 . 나는 같은 것을 선호한다

<a href="#" onclick="return handler();">Link</a>

참고 URL : https://stackoverflow.com/questions/3498492/javascriptvoid0-vs-return-false-vs-preventdefault