jQuery函數的問題

Question

我試圖做一個腳本來將容器內的元素放入列中。該腳本工作正常，直到我到4列。我看不到我要去哪裏錯了。下面的代碼，以及demo

var container = '.bar', 
    children = $(container).children().length, 
    column = 4, 
    width = $(container).width()/column - 20; 

function columnizer(value) { 

    var i = 1, 
     x = Math.ceil(value/column), 
     z = Math.round(value/column), 
     y = '<div class="column" />'; 

    $(container).children().slice(0, x).wrapAll(y); 

    while (i < column) { 
     if (value % 2 === 0 && z === 1) { 
      $(container).children().slice(i, x * i).wrapAll(y); 
      i++; 
     } 
     else if (value % 2 === 0 && z > 1) {     
      $(container).children().slice(i, x + i * i).wrapAll(y); 
      i++;    
     } 
     else { 
      $(container).children().slice(i, x + i).wrapAll(y); 
      i++; 
     } 
    } 
} 

Answer 1

$(function() { 

var container = '.bar', 
    children = $(container).children().length, 
    column = 4, 
    width = $(container).width()/column - 20; 

function columnizer(value) { 
    var i = 0, 
     x = Math.ceil(value/column), 
     z = Math.round(value/column), 
       y = '<div class="column" />'; 

    while (i < column) { 
     $(container).children(':not("div.column")').slice(0, x).wrapAll(y); 
     i++; 
     } 
} 

columnizer(children); 

$(container).append("<div class='clear'></div>"); 

$('.column').width(width); 

}); 

另外，更改您的測試數據，包括每一個Lorum或DUIS後一個數字。否則，代碼可能看起來像它的工作，但實際上不是。

這種技術也適用於任何數量的列（而不僅僅是4列）。