尽管该链接被禁用,但它仍然是可点击的。

<a href="/" disabled="disabled">123n</a>

如果它是禁用的,我可以使它不可点击吗?我应该使用JavaScript吗?


当前回答

在css的帮助下,您将禁用超链接。试试下面的方法

a.disabled { pointer-events:没有; 光标:违约; } <a href=" Link .html" class="disabled">Link</a> .html

其他回答

超链接没有disabled属性。如果你不想要某些东西被链接,那么你需要移除<a>标签。

或者,你可以删除它的href属性-尽管这有其他的用户体验和可访问性问题,在下面的评论中指出,所以不建议。

我看到这里已经贴出了大量的答案,但我不认为有任何明确的答案可以将前面提到的方法结合到我发现的有效方法中。这是为了使链接既显示为禁用,也不会将用户重定向到另一个页面。

这个答案假设你正在使用jquery和bootstrap,并使用另一个属性临时存储href属性,而禁用。

//situation where link enable/disable should be toggled
function toggle_links(enable) {
    if (enable) {
        $('.toggle-link')
        .removeClass('disabled')
        .prop('href', $(this).attr('data-href'))
    }
    else {
        $('.toggle-link')
        .addClass('disabled')
        .prop('data-href', $(this).prop('href'))
        .prop('href','#')
    }
a.disabled {
  cursor: default;
}

提示1:使用CSS指针事件:无;

JavaScript:void(0) (这是一个最佳实践)

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

使用Jquery $('selector').attr("disabled","disabled");

试试这个:

<a href="javascript:void(0)" style="cursor: default;">123n</a>

HTML:

<a href="/" class="btn-disabled" disabled="disabled">123n</a>

CSS:

.btn-disabled,
.btn-disabled[disabled] {
  opacity: .4;
  cursor: default !important;
  pointer-events: none;
}