javascript - 如何循环而不是随机的？

Question

我有一个像这样的方法:

     function randomHighlights() {
        loops++;
        var newRandom = Math.floor(Math.random() * 12 + 1);
        while (lastRandom == newRandom) {
          newRandom = Math.floor(Math.random() * 12 + 1);
        }
        lastRandom = newRandom;
        var li = $('#u-' + newRandom);
        $('#home-grid-list li').random().addClass(function() {
          var liClass = $(this).attr('class').split(/\s+/);;
          $('#home-grid-list li').removeClass('color-off');
          $('#home-grid-list li.' + liClass[0]).addClass('color-off');
          clearTimeout(timer);
        });
        $('#home-grid-list li').removeClass('text-on');
        timer = setTimeout(randomHighlights, 2500);
        if (loops == 20) {
          clearTimeout(timer);
          longHighlight();
        }
      }

它一次突出显示 4 个图像。问题是我不希望它再是随机的，因为它只有 3 种不同的选择，它是随机的，显然它最终会多次选择同一个 block ，从而产生滞后效应。现在我想循环浏览 #home-grid-list 并循环突出显示它们。关于如何做到这一点有什么建议吗？

longHighlight() 只是突出显示 4 张图片的随机 block ，时间长于返回此方法的时间。

Answer 1

编辑:这更符合您的想法吗？

JS:

var items = $('#home-grid-list').children('li');
var len = items.length;
var arr = [0,1,2,3];

window.setInterval(cycle,1000);

function cycle() {
    items.removeClass('highlight');
    for (var i=0; i<4; i++) {
    var temp = arr.shift();
    arr.push(((temp+4<len)?temp+4:temp+4-len));
    }
    for (var i=0; i<4; i++) {
        items.filter('#u-'+arr[i]).addClass('highlight');   
    }
}

这是更新的 fiddle .

<小时/>

类似这样的吗？

JS:

var items = $('#home-grid-list').children('li');
var len = items.length;
var arr = [0,1,2,3];

window.setInterval(cycle,1000);

function cycle() {
    items.removeClass('highlight');
    var temp = arr.shift();
    arr.push(((temp+4<len)?temp+4:temp+4-len));
    console.log(arr);
    for (var i=0; i<4; i++) {
        items.eq(arr[i]).addClass('highlight');   
    }
}

这是一个fiddle .