适合我的变体:

<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>

您需要删除<a>标记来摆脱这个。

或者试着使用:-

  <a href="/" onclick="return false;">123n</a>

让父类有指针事件:none将禁用子类a标签，如下所示(要求div覆盖a并且宽度/高度不为0):

<div class="disabled">
   <a href="/"></a>
</div>

地点:

.disabled {
    pointer-events: none;
}

如果你只是想暂时禁用链接，但留下href在那里启用以后(这是我想做的)，我发现所有的浏览器使用第一个href。因此，我能够这样做:

<a class="ea-link" href="javascript:void(0)" href="/export/">Export</a>

$(document).ready(function() {
   $('a').click(function(e) {
     e.preventDefault();
  });
});

我能够使用ng-href三元操作实现所需的结果

<a ng-href="{{[condition] ? '' : '/'}}" ng-class="{'is-disabled':[condition]}">123n</a>

在哪里

a.is-disabled{
   color: grey;
   cursor: default;

   &:hover {
      text-decoration: none;
   }
}