.slice和.wrapall

Question

我正在使用stackoverflow上的成员建议的一些代码，并由我调整以包装每个3列表项作为大型菜单的一部分。代码是：

var lis = $("ul > li");
for(var i = 0; i < ls.length; i+=3) {
  lis.slice(i, i+3).wrapAll("<div class='new'></div>");
}

不幸的是，这会从下一个父菜单中获取子li，以填充div中3 li的'quota'。这当然是大大搞砸了我的菜单。 有关示例，请访问此处。

有没有人有任何建议如何解决这个问题？

Answer 1

你的问题是你的选择器。由于sizzle从右向左工作，因此它只会查询所有LI elements作为直接父级UL element（通常情况一直如此）。

所以，分开你的ULs。

$('ul').each(function(){
   var $lis = $(this).children('li');
   for(var i = 0, len = $lis.length; i < len; i+=3){          
     $lis.slice(i, i+3).wrapAll("<div class='new'></div>");
  }
});

Answer 2

您是否尝试过使用类作为ht选择器来应用它？

var lis = $("ul.list-content > li");
for(var i = 0; i < lis.length; i+=3) {
  lis.slice(i, i+3).wrapAll("<div class='new'></div>");
}

但是，如果你不知道，我警告你，你正在打破dom ..你正在把ul放在ul上，这不好......;）