jquery - 将一个 ul 元素溢出到下一个元素中

Question

我有多个ul页面上的元素。我想人为限制li的数量它可以包含的元素。当达到该限制时，我希望它溢出到下一个 ul在页面上(直到它也达到限制并溢出到下一个)。等等。

<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
</ul>

在上面的示例中，我将其限制为 4 个列表项，然后溢出到下一个 <ul> :

<ul>
  <li>5</li>
  <li>6</li>
  <li>7</li>
  <li>8</li>
</ul>

我想使用 jquery 来完成此操作。谢谢。

Answer 1

假设您有一个像这样的元素数组，请尝试以下代码

var items = [1,2,3,4,5,6,7,8];

var count = 0;
var ul;
$.each(items, function(){
  if(count == 0)
   ul = $("<ul />").appendTo(document.body);

  ul.append("<li>"+this+"</li>");

  count = (count + 1) % 4;
});