Bootstrap3每行隨機列

Question

過去幾周我一直在一個新網站（feed-monster.com fyi）上工作，並且已經在md/lg/s屏幕上顯示每行2個文章，在xs屏幕上顯示每行1個文章。

我最近去並調整它看起來好一點，第一行= 3列，第2 = 1，第3（外）= 2

但現在我想讓它繼續與去循環或隨機設置每行的列數，1-3列。

我遍歷行（listi變量），然後計算列應該有什麼。

if(listi == 1){ 
     _col='col-md-4 col-sm-4'; 
    }else if(listi == 2){ 
     _col='col-md-4 col-sm-4'; 
    }else if(listi == 3){ 
     _col='col-md-4 col-sm-4'; 
    }else if(listi == 4){ 
     _col='col-md-12 col-sm-12'; 
    } else _col='col-md-6 col-sm-6'; 

    _item=$("<div>", { 
     "class": _col+ " col-xs-12" 
    }); 

我想讀一些關於如何更好地做到這一點的想法。

選項1）重複這一過程對所有行，所以你總是得到3,1,2的設置對所有的記錄。

選項2）隨機設置每行多少列（1-3），理想情況下阻止相同的＃列重複兩次，即沒有3,2,2,1。

我可以看出來，但認爲這將是一個很好的職位，因爲我沒有找到太多的搜索。

我正在使用jQuery，所以答案當然可以包括。

謝謝！

Answer 1

爲什麼不使用砌體，它更漂亮，適合每一列的內容的大小

Answer 2

落得這樣做試圖阻止每行重複列集隨機方法，它是截至年底爲它覆蓋隨機列，以確保我們不會做更多的列然後可用（可能某種方式來啾啾）。

var perrow=rand(1,3); 
var justadded=0; 
var used=totalrows; 

function builditem(){ 
    use=(totalrows-used); 

    if(justadded == perrow){ 
     oldperrow=perrow; 

     do { 
      perrow=rand(1,3); 
     } 
     while (perrow == oldperrow); 

     if(perrow > use) perrow=use; 
     justadded=0; 
    } 

    justadded++; 
    used++; 

    if(perrow == "1"){ 
     _col='col-md-12 col-sm-12'; 
    }else if(perrow =="2"){ 
     _col='col-md-6 col-sm-6'; 
    }else if(perrow =="3") _col='col-md-4 col-sm-4'; 
} 

function addmoreitems(data){ 
        totalrows=Object.keys(data).length; 
        used=0; 
        use=0; 
        justadded=0; 
        ran=3; 
        if(totalrows < ran) ran = totalrows; 
        perrow=rand(1,ran); 
}