[jquery] 앵커 링크를 클릭 할 수 없거나 비활성화하려면 어떻게해야합니까?

Program / 글쓴이

사용자가 클릭하면 비활성화하려는 앵커 링크가 있습니다. 또는 텍스트 주위에서 앵커 태그를 제거하되 텍스트는 유지하십시오.

<a href='' id='ThisLink'>some text</a>

.attr("disabled", "disabled");
비활성화 된 속성을 성공적으로 추가했지만 링크를 클릭 할 수 있음을 추가하여 버튼으로 쉽게이 작업을 수행 할 수 있습니다 .
텍스트에 밑줄이 있든 없든 상관하지 않습니다.

단서가 있습니까?

잘못된 뮤지션을 클릭하면 “Wrong”을 추가 한 다음 클릭 할 수 없게됩니다.
클릭하고 정확하면 “Awesome”을 추가 한 다음 모든 <a>태그 를 비활성화해야 합니다.

답변

나는 당신이 무엇을 요구하고 있는지 깨달았습니다. 추악한 해결책이 있습니다.

var preventClick = false;

$('#ThisLink').click(function(e) {
    $(this)
       .css('cursor', 'default')
       .css('text-decoration', 'none')

    if (!preventClick) {
        $(this).html($(this).html() + ' lalala');
    }

    preventClick = true;

    return false;
});

답변

가장 깨끗한 방법은 클릭을 비활성화하고 싶을 때 pointer-events : none 클래스를 추가하는 것입니다. 일반 라벨처럼 작동합니다.

.disableClick{
    pointer-events: none;
}

답변

<a href='javascript:void(0);'>some text</a>

답변

포인터 이벤트 CSS 스타일을 사용하십시오 . (Jason MacDonald가 제안했듯이)

MDN https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events를 참조 하십시오 . 대부분의 브라우저에서 지원됩니다.

다음과 같은 전역 CSS 규칙이있는 경우 앵커에 “disabled”속성을 간단히 추가하면됩니다.

a[disabled], a[disabled]:hover {
   pointer-events: none;
   color: #e1e1e1;
}

답변

$('a').removeAttr('href')

또는

$('a').click(function(){ return false})

상황에 따라 다름

답변

부트 스트랩은 우리에게 .disabled수업을 제공합니다 . 이용하십시오.

그러나 .disabledclass는 ‘a’태그에 이미 ‘btn’클래스가있는 경우에만 작동합니다. 이전 ‘a’태그에서는 작동하지 않습니다. 이 btn클래스는 스타일 의미가 있기 때문에 어떤 상황에서는 적절하지 않을 수 있습니다. 커버 아래에 .disabled클래스 세트 pointer-events하는 noneSaroj 아얄 및 Vitrilo이 sugested 것처럼, 그래서 당신은 같은 일을 할 수있는 CSS를 만들 수 있습니다. (이 조언에 대해 Les Nightingill에게 감사드립니다).

답변

css수업 추가 :

.disable_a_href{
    pointer-events: none;
}

이것을 추가하십시오 jquery:

$("#ThisLink").addClass("disable_a_href");