Question

我有一个div，有一个类说包装器。 html的结构看起来像这样。

<div class="wrapper">
   <div class="header">
     <a href="http://mysite.com">LOGO</a>
   </div>
   <div class="nav">
     <!-- Anchors -->
   </div>
   <div class="container">
     <!-- Other contents anchors etc. -->
   </div>
</div>

我们有什么方法可以禁用包装内的所有链接，除了div中有“nav”类的锚点？什么是有效的方法呢？

我使用以下代码禁用所有链接 -

$('.wrapper').find('a').die('click');
$('.wrapper').find('a').unbind('click');
$('.wrapper').find('a').removeAttr('onclick');
$('.wrapper').find('a[href^="javascript"]').removeAttr('href');

我们可以不使用循环检查吗？或者，它会影响相同，使用循环和不使用循环？

Answer 1

基于HarryFink的回答使用类似的东西（closest函数比parents）

更有效

$('.wrapper').on('click', 'a', function(e){  
    if(!$(this).closest('.nav')){  
        e.preventDefault();  
    }  
})

Answer 2

尝试这样的事情：

$('.wrapper').on('click', function(e){
    var $target = $(e.target);
    if(!$target.parents('.nav')){
         e.preventDefault();
    }
})

Answer 3

您可以使用以下内容定位所有anchors的{{1}}的后代，这些wrapper的后代包含在另一个div中，而nav没有类$('.wrapper div:not(".nav") a')：< / p>

{{1}}

Answer 4

尝试

$('.wrapper').find('a').not($('.wrapper').find('.nav a')).on('click', function(e){
    e.preventDefault();
})

Answer 5

试试这个，

$('.wrapper div:not(".nav") a').removeAttr('href');

Working fiddle

Answer 6

看看这里：http://jsfiddle.net/jSEnu/1/

<强> CODE

$(".wrapper div:not('.nav') a").prop("href", "#");

Answer 7

像这样选择

$('div.wrapper > div:not(".nav") a')

样本（不一样，只是类似）：http://jsfiddle.net/balintbako/rGwtw/

禁用父块中的所有链接，但不禁用其子块中的所有链接

7 个答案: