javascript - 如何在每三个对象上创建一个中断循环？

Question

我想为前三个数据库对象添加一个类，然后为 4 到 6 个对象添加另一个类，依此类推...

我找到了打破循环的方法，但我希望有更好的方法来完成三个循环，而不是硬编码很多循环？

感谢所有帮助!

http://jsfiddle.net/r61bce3z/

这是我的循环的基础知识:

var tableContent = '';

$.getJSON( '/users/insights', function( data ) {
userListData = data;
$.each(data, function(){
    tableContent += '<ul>';
    tableContent += '<li class="sub">' + this.date + '</li>';
    tableContent += '</ul>';
});

Answer 1

$.each() 方法使用其所指向的元素的索引来调用您的函数。因此，使用它和一些算术作为类名数组的索引:

var classes = ['class1', 'class2', 'class3', 'class4'];

$.getJSON( '/users/insights', function( data ) {
    userListData = data;
    $.each(data, function(i){
        tableContent += '<ul>';
        tableContent += '<li class="' + classes[Math.floor(i/3) % classes.length]
                        + '">' + this.date + '</li>';
        tableContent += '</ul>';
    });
});

使用 Math.floor(i/3) 为您提供 3 组。如果您的 3 组比类(class)数量多，则可以添加 %classes.length (这样您就不会超出类数组的末尾，它只会开始重用数组开头的类)。