Question

我有三个清单。当我点击下一个时我想得到下一个li，这很好但是当我到达第一个列表的末尾时我希望下一个是第二个列表的第一个..我会尝试解释一下好一点。

<ul class='list'>
   <li image_id="1"></li>
   <li image_id="2"></li>
</ul>

<ul class='list'>
   <li image_id="3"></li>
   <li image_id="4"></li>
</ul>

<ul class='list'>
   <li image_id="5"></li>
   <li image_id="6"></li>
</ul>

所以我有三个清单..接下来我想知道我有多少李，所以我写了..

var how_many $('ul.list li').length;

这很好，它带回了所有6个li ..

接下来我想找到一个li，如果它当前有图片ID。

var which = $('ul.list li[image_id^="' +  image_id +'"]');

此时一切正常。

所以现在我要找到下一个li的图片ID是什么..

var found_next = which.nextAll('ul.list li').attr('image_id');

这也有效..

然后我使用.load加载新图像，该回调具有更新当前image_id的回调......

“问题”是点击，下一个......下一个......等等，我到第一个列表的结尾说jquery带回“未定义”而不是第二个列表的第一个li。有没有人有任何建议？

非常感谢任何帮助。

Answer 1

.nextAll仅适用于兄弟姐妹。如果您想跳转到下一个<li>，则必须选择所有元素，然后使用.index和.eq()选择下一个<li>。

var $li = $('ul.list li');
// Example, inside an event listener:
    var index = $(this).index($li);
    var nextElement = $li.eq( index + 1 );

Answer 2

不确定你是否已经弄清楚了。如果没有，你可以尝试：

var $li = $('ul.list li'), i = 0, $currentLi;

$('button').click(function(){
    if(i < $li.length) {
        $currentLi = $li.eq(i); //eq(i) returns a jQuery object where i is the zero-based index
        i++
    }else {
        alert('End of LIs');
    }
});

这是一个有效的 Demo

nextAll（） - 多个列表遍历

2 个答案: