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

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

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


当前回答

你可以通过返回false来禁用锚标记。在我的情况下,我使用angular和ng-disabled的Jquery手风琴,我需要禁用部分。

所以我创建了一个小js片段来解决这个问题。

       <a class="opener" data-toggle="collapse"
                   data-parent="#shipping-detail"
                   id="shipping-detail-section"
                   href="#shipping-address"
                   aria-expanded="true"
                   ng-disabled="checkoutState.addressSec">
                   Shipping Address</a>
     <script>
          $("a.opener").on("click", function () {
           var disabled = $(this).attr("disabled");
           if (disabled === 'disabled') {
            return false;
           }
           });
     </script>

其他回答

以下是禁用a标记的各种方法:

<a >链接文本</a>从锚标签中移除href <a href= " javascript:void(0) " />链接文本</a>在href中放入javascript:void(0) <a href="/" onclick="return false;">链接文本</a>使用返回false 因为锚标签没有被禁用的属性。 如果你想在jQuery函数中停止锚标记行为,你可以在函数的开头使用下面的行:

$( "a" ).click(function( e ) {
e.preventDefault();
$( "<div>" )
.append( "default " + e.type + " prevented" )
.appendTo( "#log" );
});

event.preventDefault ()

试试这个:

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

最好的答案总是最简单的。不需要任何编码。

如果(a)锚标记没有href属性,它只是一个超链接的占位符。所有浏览器均支持!

<a href="/">空闲web计数器</a><br /> <a "/">空闲web计数器</a> .

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

这个答案假设你正在使用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;
}

当您将鼠标移到href标签上时,href标签中的任何内容都将显示在浏览器窗口的左下角。

我个人认为像javascript:void(0)这样的东西显示给用户是可怕的。

相反,关闭href,使用jQuery/其他工具,添加一个样式规则(如果你仍然需要它看起来像一个链接):

a {
    cursor:pointer;
}