javascript - 使用 Javascript 在运行时禁用 <a href>

Question

使用 Bootstrap

  <ul class="nav nav-pills nav-stacked col-sm-2 hidden" id="menu">
                <li role="presentation" id="LiNewsFeed"><a href="javascript:GetNewsFeed();">News Feed</a></li>
                <li role="presentation" id="LiStatusUpdate"><a href="javascript:StatusUpdate();">Update Status</a></li>
                <li role="presentation" id="LiWriteWall"><a href="javascript:WriteOnWall();">Post On Wall</a></li> 
                <li role="presentation" id="LiNotifications"><a href="javascript:GetNotifications();">Notifications</a></li>
                <li role="presentation" id="LiLogOut"><a href="javascript:LogOut();">Logout</a></li> 
  </ul>

在 Javascript 中，我禁用了一些 <li>像下面这样:

 $('#LiNewsFeed').addClass('disabled');

列表中的项目实际上看起来已禁用，当我单击它时，它实际上调用了 javascript 函数，因此，我需要的是禁用 <a href>不仅仅是<li>

我尝试在 $(document).ready 之后添加此内容:

$(".nav li.disabled a").click(function () {
                return false;
});

但它并没有真正做任何事情。

我需要的是禁用 <a href>禁用后立即<li>在我的 Js 代码中，而不是依赖于单击事件...

似乎没有办法禁用 <a href> ，所以我需要一种解决方法

如有任何帮助，我们将不胜感激。

Answer 1

使用下面的代码。检查工作示例 JSFIDDLE

$(".nav li.disabled a").each(function(){
     $(this).attr('href','javascript:void(0);');
});