0

我正在使用一个简单的 each 函数将一个类添加到无序列表中的一组 li 标签中。 

$('div ul li').each(function(e){
   $(this).addClass('c' + e);       
});

它返回以下 HTML

<div>
    <ul>
        <li class="c0"></li>
        <li class="c1"></li>
        <li class="c2"></li>
        <li class="c3"></li>
    </ul>
</div>  
<div>
    <ul>
        <li class="c4"></li>
        <li class="c5"></li>
        <li class="c6"></li>
        <li class="c7"></li>
    </ul>
</div>

它正在做它应该做的就是将索引添加到类名的末尾。我怎样才能使它为每个新的无序列表重置。所以它会返回这样的东西。

<div>
    <ul>
        <li class="c0"></li>
        <li class="c1"></li>
        <li class="c2"></li>
        <li class="c3"></li>
    </ul>
</div>  
<div>
    <ul>
        <li class="c0"></li>
        <li class="c1"></li>
        <li class="c2"></li>
        <li class="c3"></li>
    </ul>
</div>

这是我上面粘贴的代码的 JS 小提琴，以及我目前拥有的工作版本：http: //jsfiddle.net/kdGgK/1/

4

4 回答 4

3

使用.index()，它会告诉您每个元素相对于其兄弟元素的索引

$('div ul li').each(function(e){
   $(this).addClass('c' + $(this).index());        
});

http://jsfiddle.net/mowglisanu/kdGgK/3/

于 2012-11-20T02:42:16.963 回答
2

您可以嵌套 each() 函数。

$('div ul').each(function() {
   $(this).children('li').each(function(e){
      $(this).addClass('c' + e);        
   });
});
于 2012-11-20T02:42:14.267 回答
2

只需选择第ul一个，从 开始循环ul并将该类应用于li每个ul.

$('div ul').each(function(e){
    $(this).find('li').each(function (e) {
        $(this).addClass('c' + e);        
    });
});

JS 小提琴：http: //jsfiddle.net/kdGgK/2/

于 2012-11-20T02:42:27.423 回答
1

为每个无序列表 li 应用不同的类

 $('div ul').each(function(){
    $(this).children('li').each( function(e){
       $(this).addClass('c' + e);       
     });
  });

为每个无序列表 li 应用一个类

 $('div ul').each(function(e){
    $(this).children('li').addClass('c' + e);       
  });
于 2012-11-20T02:43:06.503 回答