Javascript 如何使用setTimeout或setInterval减慢循环速度

我有一个叫做RotatorNames的数组。它包含随机的东西，但我们可以说它包含

[“rotatorA”，“rotatorB”，“rotatorC”]

我想在数组中循环，并为每个项目触发一个单击事件。我已经做了一些工作，除了一切都会立即触发。如何强制循环等待几秒钟，然后继续循环

这是我的

function Rotator() {
    var RotatorNames = ["rotatorA","rotatorB","rotatorC"];
    RotatorNames.forEach(function(entry){
        window.setTimeout(function() {
            //Trigger that elements button.
            var elemntBtn = $('#btn_' + entry);
            elemntBtn.trigger('click');
        }, 5000);
    });
}

你可以运行这个来看看我的问题是什么。

---

此外，有时警报执行A、C、B而不是A、B、C。您可以根据当前索引增加超时时间：

RotatorNames.forEach(function(entry, i) {
    window.setTimeout(function() {
        //Trigger that elements button.
        var elemntBtn = $('#btn_' + entry);
        elemntBtn.trigger('click');
    }, 5000 + (i * 1000)); // wait for 5 seconds + 1 more per element
});

---

您可以根据当前索引增加超时时间：

RotatorNames.forEach(function(entry, i) {
    window.setTimeout(function() {
        //Trigger that elements button.
        var elemntBtn = $('#btn_' + entry);
        elemntBtn.trigger('click');
    }, 5000 + (i * 1000)); // wait for 5 seconds + 1 more per element
});

---

像这样的东西应该能满足你的需求：

function Rotator(index){
  var RotatorNames = ["rotatorA","rotatorB","rotatorC"];
  index = (index === undefined ? 0 : index);

  var $btn = $("#btn_"+RotatorNames[index]);
  $btn.click();

  if(RotatorNames[index+1]!==undefined){
    window.setTimeout(function(){
      Rotator(index+1);
    }, 500);
  }
}

---

像这样的东西应该能满足你的需求：

function Rotator(index){
  var RotatorNames = ["rotatorA","rotatorB","rotatorC"];
  index = (index === undefined ? 0 : index);

  var $btn = $("#btn_"+RotatorNames[index]);
  $btn.click();

  if(RotatorNames[index+1]!==undefined){
    window.setTimeout(function(){
      Rotator(index+1);
    }, 500);
  }
}

---

虽然我相信其他答案也可以，但我更喜欢使用以下设置：

function rotator(arr) {
    var iterator = function (index) {
        if (index >= arr.length) {
            index = 0;
        }
        console.log(arr[index]);
        setTimeout(function () {
            iterator(++index);
        }, 1500);
    };

    iterator(0);
};

rotator(["rotatorA", "rotatorB", "rotatorC"]);

演示：

对我来说，这似乎比通过将“正确”值传递给

setTimeout

来让迭代正确排列更符合逻辑

---

这允许按顺序连续迭代数组。如果您希望它在经过一次之后停止，请更改

index=0到
返回
虽然我确信其他答案都可以，但我更喜欢使用此设置：

function rotator(arr) {
    var iterator = function (index) {
        if (index >= arr.length) {
            index = 0;
        }
        console.log(arr[index]);
        setTimeout(function () {
            iterator(++index);
        }, 1500);
    };

    iterator(0);
};

rotator(["rotatorA", "rotatorB", "rotatorC"]);

演示：

对我来说，这似乎比通过将“正确”值传递给
setTimeout
来让迭代正确排列更符合逻辑

这允许按顺序连续迭代数组。如果您希望它在经过一次之后停止，请更改
index=0到
返回
尝试：

var idx = 0;
function Rotator() {
    var RotatorNames = ["rotatorA", "rotatorB", "rotatorC"];
        setTimeout(function () {
            console.log(RotatorNames[idx]);
            idx = (idx<RotatorNames.length-1) ? idx+1:idx=0;
            Rotator();
        }, 5000);
}
Rotator();

var idx=0；
函数旋转器（）{
变量RotatorNames=[“rotatorA”、“rotatorB”、“rotatorC”]；
setTimeout（函数（）{
console.log（RotatorNames[idx]）；
idx=（idxTry:

var idx=0；
函数旋转器（）{
变量RotatorNames=[“rotatorA”、“rotatorB”、“rotatorC”]；
setTimeout（函数（）{
console.log（RotatorNames[idx]）；
idx=（IDX这工作得很好，但出于某种原因，第一个数组项get在进入B之前重复，Ci找出了原因。这是因为我在0处启动forloop，默认情况下0已显示。这工作得很好，但出于某种原因，第一个数组项get在进入B之前重复，Ci找出了原因。这是因为我在启动for循环0处的循环，默认情况下已显示0。非常好，这实际上也会重新启动。谢谢！非常好，这实际上也会重新启动。谢谢！