正确使用按钮和链接。

•按钮激活网页上的脚本功能(对话框，展开/折叠区域)。

•链接带你到另一个位置，无论是到不同的页面或同一页面上的不同位置。

如果你遵循这些规则，就不会出现任何需要禁用链接的情况。即使你让一个链接看起来视觉残疾和空白点击

<a href=“” ng-click=“Ctrl._isLinkActive &&$ctrl.gotoMyAwesomePage（）”

你不会考虑可访问性，屏幕阅读器会将其视为链接，视力受损的人会一直好奇为什么链接不起作用。

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

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

有一种简单干净的方法:

<a href="/shopcart/">

  <button class="btn" disabled> Make an Order </button>

</a>

默认情况下，在<button>上禁用属性不会让点击通过<button>元素直到<a>元素。所以<a>元素甚至不知道发生了一些点击。通过在<button>上添加/删除禁用属性进行操作。

如果你想摆脱指针，你可以用css使用游标。

适合我的变体:

<script>
  function locker(){
    if ($("a").hasClass("locked")) {
         $("a").removeClass('locked').addClass('unlocked');
         $("a").attr("onClick","return false");
    } else {
         $("a").css("onclick","true");
         $("a").removeClass('unlocked').addClass('locked');
         $("a").attr("onClick","");
    }
  }
</script>

<button onclick="locker()">unlock</button>

<a href="http://some.site.com" class="locked">
  <div> 
      .... 
  <div>
</a>

您可以使用以下解决方案之一:

HTML

<a>link</a>

JavaScript

<a href="javascript:function() { return false; }">link</a>
<a href="/" onclick="return false;">link</a>

CSS

<a href="www.page.com" disabled="disabled">link</a>

<style type="text/css">
    a[disabled="disabled"] {
        pointer-events: none;
    }
</style>