將一個ul元素溢出到下一個

我在頁面上有多個ul元素。我想人爲地限制它可以包含的li元素的數量。當達到該限制時，我希望它溢出到頁面上的下一個ul（直到它達到極限並溢出到下一個）。等等。將一個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。謝謝。

來源

2011-08-02 Robert

你的問題是缺乏細節。列在頁面上的元素，還是你正在創建它們？頁面上的div容器是？ – user113716

你是什麼意思「一旦div達到一定數量」？ HTML不會限制子元素的數量（據我所知...瀏覽器可能，但規範不） – cdeszaq

好吧，而不是Divs我的意思是UL內的列出的元素。一旦達到4就會創建一個新的ul。這些元素是通過PHP生成的。我試圖用JQuery來組織它們。 whoa downvotes：'（ – Robert

這應該通過每個UL，並在第一個非完整插入。

function insert(el){ 
    $('ul').each(function(_, ul){ 
     if($(ul).children('li').length >=4) 
      return true; 
     $(ul).append(el); 
     return false; 
    } 
}

來源

2011-08-02 16:17:40 Andrew

謝謝你這個作品：D – Robert

假設你已經元素的一個這樣的數組，試試下面的代碼

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; 
});

來源

2011-08-02 16:11:31 ShankarSangoli

實際上更具體的這是可滾動的。 http://flowplayer.org/tools/demos/scrollable/index.html而不是divs im使用ul的和列出的項目。哪個php正在生成。現在它只是吐出列出的項目，我需要他們分組，所以它正確滾動。謝謝 – Robert

您可以輕鬆脫離模塊化算術（'count =（count + 1）％4;'） –

感謝@Chris您的建議。 – ShankarSangoli

將一個ul元素溢出到下一個

回答

相關問題