Question

我有这样的结构：

<div>
     <div> 
         <div onclick="someFunction(this)"></div>
     </div>
     <div> 
         <div onclick="someFunction(this)"></div>
     </div>
     ..
     ..
</div>

因此，在我的someFunction()内，如何遍历已在其上实施div的所有onclick？

我想到了以下几点：

$(this).parent().parent().children().each( function () { } );

但不知怎的，我完全确定这是错的。因为两次执行parent()可能会将我带到最顶层的父级，但之后迭代通过每个子级实际上不会遍历所有div上的onclick，而是它将遍历div上面的一个级别。如果我再次children()再做each()，我认为它不会做我想要的。请指导。

Answer 1

为什么不直接用实现的onclick方法为所有div分配一个类？

所以你会做这样的事情

HTML

<div>
     <div> 
         <div class="someDiv"></div>
     </div>
     <div> 
         <div class="someDiv"></div>
     </div>
     ..
     ..
</div>

脚本

$(".someDiv").each(function(){
    somefunction(this);
});

Answer 2

您可以通过将parents()链接到eq()来匹配祖父元素，然后将find()与Has Attribute选择器匹配，以匹配您<div>元素感兴趣的是：

$(this).parents().eq(1).find("div[onclick]").each(function() {
    // ...
});

如果您要排除当前<div>，可以使用not()：

$(this).parents().eq(1).find("div[onclick]").not(this).each(function() {
    // ...
});

Answer 3

你可以这样做：

$('div[onclick*=someFunction]')

Answer 4

添加一个类以轻松选择所需的所有元素。

<div>
     <div> 
         <div class="myClass"></div>
     </div>
     <div> 
         <div class="myClass"></div>
     </div>
     ..
     ..
</div>

$(document).ready(function(){
    //All your elements which have a class myClass
    $elements = $('.myClass');

    $.each($elements,function(){
        //Here you are going through all your elements
    });

    $('.myClass').click(function(){
        //Here you are executing your function
        someFunction(this);
    });
});

如何循环遍历多个div

4 个答案: