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