앵커 태그가 아무것도 참조하지 않도록 만드는 방법은 무엇입니까?

앵커 태그가 아무것도 참조하지 않도록 만드는 방법은 무엇입니까?

jQuery를 사용합니다. 일부 앵커 태그에서 작업을 수행하지 않도록 해야 합니다.

저는 보통 이렇게 씁니다.

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

그러나 이것은 페이지의 맨 위를 나타냅니다!

완벽하지 않은 솔루션이 몇 가지 있습니다.

가짜 앵커 링크

<a href="#">

문제: 링크를 클릭하면 페이지 맨 위로 돌아갑니다.

'a'가 아닌 다른 태그 사용

스팬 태그를 사용하고 jquery를 사용하여 클릭을 처리합니다.

문제: 키보드 탐색이 중단되어 커서를 수동으로 변경해야 합니다.

Javascript void 함수에 대한 링크

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

문제: IE에서 이미지를 링크할 때 중단됨

해결책

이 모든 것에 문제가 있기 때문에 제가 결정한 해결책은 가짜 앵커에 연결한 다음 onClick 방법에서 false를 반환하는 것입니다.

<a href="#" onClick="return false;">

가장 간결한 해결책은 아니지만 위의 방법으로 모든 문제를 해결합니다.

아무 것도 가리키고 싶지 않다면, 아마도 당신은 그것을 사용하지 말아야 할 것입니다.<a>꼬리표를 달다

링크처럼 행동하지 , 요소를 이 가장 . (예:<span>) 그런 다음 CSS를 사용하여 스타일을 지정합니다.

<span class="fake-link" id="fake-link-1">Am I a link?</span>

.fake-link {
    color: blue;
    text-decoration: underline;
    cursor: pointer;
}

또한, 당신이 이 질문을 "jQuery"라고 태그한 것을 고려할 때, 나는 당신이 클릭 이벤트 핸들러를 부착하기를 원한다고 생각합니다.그렇다면 위와 동일한 작업을 수행한 후 다음 JavaScript와 같은 작업을 사용하십시오.

$('#fake-link-1').click(function() {
    /* put your code here */
});

작업을 전혀 수행하지 않으려면 다음을 사용합니다.

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

이를 처리하는 올바른 방법은 링크를 처리할 때 jQuery로 링크를 "끊는" 것입니다.

HTML

<a href="#" id="theLink">My Link</a>

제이에스

$('#theLink').click(function(ev){
    // do whatever you want here

    ev.preventDefault();
    ev.stopPropagation();
});

마지막 두 번의 통화는 클릭을 해석하는 브라우저를 중지합니다.

이렇게 할 수 있는 방법은 아주 많습니다.

추가하지 않음 및href속성

<a name="here"> Test <a>

href like 대신 onclick 이벤트를 추가할 수 있습니다.

<a name="here" onclick="YourFunction()"> Test <a>

아니면 이렇게 void 기능을 추가하는 것이 가장 좋은 방법일 것입니다.

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

무일푼이라니요?

<a href='about:blank'>blank page</a>

또는

<a href='whatever' onclick='return false;'>won't navigate</a>

이 답변은 새로운 웹 표준(HTML5)을 반영하도록 업데이트되어야 합니다.

다음 항목:

<a tabindex="0">This represents a placeholder hyperlink</a>

올바른 HTML5입니다. 탭인덱스 속성을 사용하면 일반 하이퍼링크처럼 키보드 포커스가 가능합니다.당신은 그것을 사용하는 것이 좋을 것입니다.span앞서 언급했듯이, 나는 이것에 대한 요소를 사용하는 것을 발견했습니다.a요소가 더 우아합니다.

참조: https://w3c.github.io/html-reference/a.html
그리고: https://html.spec.whatwg.org/multipage/links.html#attr-hyperlink-href

해보셔도 될 것 같아요.

<a href="JavaScript:void(0)">link</a>

여기 보이는 유일한 특징은 자바스크립트 실행 시 브라우저 보안 수준이 높다는 것입니다.

비록 이것이 더 쉬운 방법 중 하나이긴 하지만.

<a href="#" onclick="return false;">Link</a>

이것은 아껴써야 합니다.

이 기사를 읽고 일부 포인터를 확인하십시오. https://web.archive.org/web/20090301044015/http ://blog.reindel.com/2006/08/11/a-hrefjavascriptvoid0-avoid-the-void

▁for다▁ 3가지 이 있습니다.<a>술래잡기href태그 속성은 다음을 참조하지 않습니다.

<a href="JavaScript:void(0)"> link </a>

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

<a href="#" onclick="return false;"> Link </a>

이것이 오래된 질문이라는 것을 알지만, 어쨌든 2센트를 더해야겠다고 생각했습니다.

링크가 수행하는 작업에 따라 다르지만, 일반적으로 같은 작업을 표시하거나 수행할 수 있는 URL을 가리키며, 예를 들어 상자 팝업에 대해 약간 설명할 수 있습니다.

<a id="about" href="/about">About</a>

그러면 jQuery를 사용합니다.

$('#about').click(function(e) {
    $('#aboutbox').show();
    e.preventDefault();
});

이러한 방식으로 매우 오래된 브라우저(또는 JavaScript가 비활성화된 브라우저)는 여전히 별도의 정보 페이지로 이동할 수 있지만, 더 중요한 것은 Google이 이 페이지를 선택하여 정보 페이지의 내용을 탐색한다는 것입니다.

에 "" " " " " " "이 있는지 합니다.href="#!"원하는 어떤 로) 그 을 사용합니다

jq('body').on('click.stop_link', 'a[href="#!"]',
function(event) {
     event.preventDefault();
});

HTML 앵커를 가질 수 있습니다(ahref기여하다.를 중지합니다.href속성 및 아무것도 연결되지 않습니다.

<a>link</a>

저에게 유일하게 효과가 있었던 것은 위와 같은 조합이었습니다.

첫째는번는.li에 시대에ul

<li><a onclick="LoadTab2_1()" href="JavaScript:void(0)">All Assigned</a></li>

그런 다음 LoadTab2_1에서 탭 div를 수동으로 전환했습니다.

$("#tabs-2-1").hide();
    $("#tabs-2-2").show();

의 연결을 끊으면 탭의 작업도 연결이 끊어지기 때문입니다.

또한 기본 탭이 변경될 때 탭 스타일을 수동으로 수행해야 합니다.

$("#secTab1").addClass("ui-tabs-active").addClass("ui-state-active").addClass("ui-state-hover").addClass("ui-state-focus");
    $("#secTab1 a").css("color", "#ffffff");

당신은 할 수 있습니다.

<a style='cursor:pointer' >Link</a>

<a href="#" onclick="SomeFunction()"  class="SomeClass">sth.</a>

이것은 제 앵커 태그였습니다. 따라서 Click=" 이벤트에서 false를 반환합니다." 이벤트는 여기서 유용하지 않습니다.방금 href="#" 속성을 제거했는데 아래와 같이 작동했습니다.

<a onclick="SomeFunction()"  class="SomeClass">sth.</a>

그리고 나는 이 css를 추가해야 했습니다.

.SomeClass
{
    cursor: pointer;
}

WordPress 사이트에서 이 문제를 발견했습니다.드롭다운 메뉴의 헤더에는 항상 속성이 있습니다.href=""및 헤더 플러그인은 표준 URL만 사용할 수 있습니다.가장 쉬운 해결책은 바닥글에서 이 코드를 실행하는 것이었습니다.

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

이렇게 하면 빈 앵커가 아무것도 할 수 없습니다.

이와 같은 기능을 사용하여 더 이상 지원하지 않음href="javascript:void(0)"하지만 여기 꽤 잘 작동하는 것이 있습니다.

<a href="#" onClick={() => null} >link</a>

이 질문에 jQuery 질문으로 태그가 지정되어 있지만 AngularJS로도 답변할 수 있습니다.

요소에 ng-click 지시문을 추가하고 클릭 이벤트인 $event 변수를 사용합니다...기본 동작을 방지합니다.

<a href="#" ng-click="$event.preventDefault()">

$event 변수를 함수로 전달할 수도 있습니다.

<a href="#" ng-click="doSomething($event)">

그 기능에서는 클릭 이벤트로 원하는 것은 무엇이든 할 수 있습니다.

HTML5에서 제거하기만 하면 됩니다.href기여하다

<a>Your text</a>

언급URL : https://stackoverflow.com/questions/924790/how-to-make-an-anchor-tag-refer-to-nothing