IT story

아무데도 가지 않는 링크를 어떻게 만드나요

hot-time 2020. 12. 28. 21:59
반응형

아무데도 가지 않는 링크를 어떻게 만드나요


아무것도하지 않는 링크를 만들 수 있습니까? 항목이 링크가되기를 원하므로 마우스를 올려 놓으면 커서가 변경되지만 링크가 실제로는 동일한 페이지에 추가 기능이있는 div 표시를 트리거하므로 실제로 아무데도 이동하지 않기를 바랍니다.


브라우저 기록에 추가됩니다.

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

브라우저 기록에 추가하지 않음 (선호하는 방법) :

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


대신 a <span>를 사용하고 커서 스타일을 설정할 수 있습니다 .

<span id="node42" class="node-link">My Text</span>

스타일 시트에 커서를 지정합니다.

.node-link { cursor: pointer; }

또한 나중에 작업을 위해 노드에 연결할 수 있습니다 ( Prototype을 사용하여 여기에 표시 ).

<script type="text/javascript">
    $('node42').observe('click', function(event) {
      alert('my click handler');
    });
</script>

제 생각에 가장 완벽한 해킹 무료 솔루션 :

<a href="" onclick="return false;">do absolutely nothing</a>

cursor:pointer요소에 스타일 추가하기 만하면됩니다 .

<a id="clickme">Click Me</a>

CSS :

#clickme { cursor: pointer }

또는 (천국 금지) 인라인 :

<a style="cursor:pointer">Click Me</a>

여기에 2있는 고전 자바 스크립트는 그 접근 당신에게 오류를 제공하지 않습니다 당신에 JS 콘솔 및 / 또는 브라우저 기록에 저장 URL도 변경하지 마십시오 :

<a href="javascript:void(0);">Click on this javaScript error-free link that won't change your URL nor save it into your browser history</a><hr />
<a href="#void">Maybe a more readable approach, but unfortunately this one changes your URL</a>


스타일 만 원한다면 CSS 커서 속성 을 포인터로 설정하십시오 .

그러나 당신이 원하는 것처럼 들립니다 <a href="javascript:void(do_something())">.


한 가지 옵션은 #someid를 가리키는 것입니다. 수직 스크롤을 해당 요소로 이동하지만 원하는 것일 수도 있고 아닐 수도 있습니다.

추신. 스타일로 동일한 결과를 얻을 수 있습니다.


더 간단한 것을 찾고 있었는데 찾은 것 같아요. 링크가 어디에도 가지 않도록 하시겠습니까? 를 생략합니다 href.

<a class='irrelevant_for_this_example'>Some text</a>

href="#" 페이지 상단으로 스크롤됩니다.

href="javascript:;" 이상해 보인다.

JS 솔루션은 단순한 것에는 불필요 해 보입니다.

참조 URL : https://stackoverflow.com/questions/1830927/how-do-i-make-a-link-that-goes-no-where

반응형