jQuery .after() 试图“纠正”我插入的 html。我该如何阻止这个？

Question

我正在尝试将一个长长的无序列表分解成更小的部分，如下所示：

$('.cList').each(function() {
    var thisList = $(this).find('li')
    var thisLen = thisList.length
    for(var x=0;x<thisLen;x++) {
        if((x % 5)==0&&x>0) {
            $(thisList).eq(x).after("</ul><ul>")    
        }    
    }
})

我最终得到的是这样的：

<li>...</li>
<li>...</li>
<li>...</li>
<li>...</li>
<li>...</li>
<ul></ul> <---- I want the list to end and start, not make a nested list

而不是这个：

<li>...</li>
<li>...</li>
<li>...</li>
<li>...</li>
<li>...</li>
</ul><ul>  <--- like this

就好像插入 </ul><ul> 不是有效的 HTML 并且 jQuery 以某种方式决定 <ul></ul> 是有效的。

见：http://jsfiddle.net/MGHt5/

Answer 1

我不会特别担心打开和关闭标签，而是使用.wrapAll() 将<ul> 标签包裹在一个包含5 个<li>s 的jQuery 对象周围。您可以使用.slice() 从thisList 中获取<li>s 的块。