LI 项和 jQuery 的奇怪 DOM 缓存/刷新问题

Question

我有一个动态注入的<li> 项目，第一个项目被标记为“.current”类。我在 DOM 中也有“下一个”按钮，它从列表中带有“.current”类的项目加载下一个项目。但是，当我动态重新填充列表时，“下一步”按钮将加载列表中的所有其他项目。如果我再次重新填充列表，下一个按钮将加载列表中的每 3 个项目。 List 通过 $.ajax 填充，是一个 json 数据类型。每次我重新填充时，我都会删除所有列表项，如下所示：

 $('#playlist').children().remove();

下一个按钮查找下一项如下：

 $('#playlist ul').find(".current").nextAll().first().children('a');

关于为什么加载列表中的“下一项”会出现不一致的任何想法/建议？显然，这也与重新填充列表有关。我正在设置"cache":false 在填充列表的 $.ajax 调用中......

当这种不一致发生时，下一个项目似乎是从先前加载的列表中的项目（类“.current”）开始的。

小提琴：http://jsfiddle.net/unA6h/7/（不是我拥有的完整代码，而是让我头疼的部分；列表从 ajax call..json 等填充。）

Answer 1

您在没有任何兄弟姐妹的锚标记上调用.nextAll()，因此.nextAll() 没有任何元素。您需要在.nextAll() 之前添加.parent()。我还在下面做了一个小优化，当你已经有了元素时，获取 id 并通过 id 选择没有意义。

var next_item = $('#playlist ul').find('.current').parent().nextAll('li[role="normal_item"]').first().children('a');
setItemAsCurrent(next_item);

http://jsfiddle.net/unA6h/16/