使用 javascript 禁用特定链接，保持其他链接处于活动状态答案

【问题标题】：Disable a specific Link with javascript, keep others active使用 javascript 禁用特定链接，保持其他链接处于活动状态
【发布时间】：2014-07-06 13:12:20
【问题描述】：

我有这个结构，想禁用某些链接而不影响某个 div 中的其他链接。

<div class="navigation">
<a href"#">DISABLE THIS LINK</a>
<ul class="submenu">
<li><a href="#">KEEP THIS LINK ENABLED</a></li>
<li><a href="#">KEEP THIS LINK ENABLED</a></li>
<li><a href="#">KEEP THIS LINK ENABLED</a></li>
</ul>
<a href"#">DISABLE THIS LINK</a>
<ul class="submenu">
<li><a href="#">KEEP THIS LINK ENABLED</a></li>
<li><a href="#">KEEP THIS LINK ENABLED</a></li>
<li><a href="#">KEEP THIS LINK ENABLED</a></li>
</ul>
<a href"#">DISABLE THIS LINK</a>
<ul class="submenu">
<li><a href="#">KEEP THIS LINK ENABLED</a></li>
<li><a href="#">KEEP THIS LINK ENABLED</a></li>
<li><a href="#">KEEP THIS LINK ENABLED</a></li>
</ul>
</div>

我试过这样的：

$(".navigation a").click(function(e){ e.preventDefault(); });
$(".subitem a").click(function(){ return true; });

但这没有用。

有什么想法可以禁用“禁用此链接”并在不更改 HTML 的情况下保持启用其他链接吗？

【问题讨论】：

标签： javascript jquery mobile navigation

【解决方案1】：

您可以通过更改选择器来实现此目的。

(".navigation a") 将选择 .navigation 类中的所有 'a' 标签，如果将其更改为 (".navigation > a")，它将仅选择直接子 'a' 元素。

【讨论】：

【解决方案2】：

您可以检查被点击的链接是否有带有class=".submenu" 的父元素，如果有，它将评估该语句为真，一切都会正常工作。如果它不是.submenu 的孩子，那么你调用e.preventDefault() 这样它就不会在点击时做任何事情。

$(".navigation a").click(function(e){
    if ($(this).parent().parent('.submenu')) {
        return true;
    }
    else {
       e.preventDefault();
    }
});

【讨论】：

【解决方案3】：

您可以只选择导航 DIV 的直接子级。

$(".navigation").children('a').click(function(e){ 
    e.preventDefault();
});

http://jsfiddle.net/8QuWj/3/

【讨论】：