停止 javascript 循环答案

【问题标题】：Stop javascript from looping停止 javascript 循环
【发布时间】：2016-10-01 15:00:55
【问题描述】：

我正在使用这个脚本来替换我页面上的一些文本。

function initChangeText() {
  var time = 2;
  setInterval('changeText();', time * 1000);
}

function changeText() {
  var divs_ = document.getElementsByTagName("div")
  for (var i = 0; i < divs_.length; i++)
    if (divs_[i].className == "change")
      changeULText(divs_[i]);    
}

function changeULText(obj) {
  var ul = obj.getElementsByTagName("ul")[0];
  var li = obj.getElementsByTagName("li");
  for (var i = 0; i < li.length; i++) {
    if (li[i].className == "show") {
      li[i].className = "";
      li[(i + 1) % li.length].className = "show";
      return;
    }
  }
}
window.onload = initChangeText;

问题是这个脚本在循环它自己。我不希望它。我希望它执行一次然后停止。

我该怎么做？

【问题讨论】：

听起来你应该使用setTimeout 而不是setInterval
您应该避免将string 值传递给setTimeout 或setInterval 函数，如http://stackoverflow.com/a/5801700/6832715 解释的那样

标签： javascript loops

【解决方案1】：

这个：

function initChangeText() {
  var time = 2;
  setInterval('changeText();', time * 1000);
}

每秒调用一次脚本。删除该功能并将window.onload = initChangeText;更改为window.onload = changeText;

【讨论】：

【解决方案2】：

正如 Crayon Violent 在评论中所说，您应该使用 setTimeout 而不是 setInterval。

来自 Mozilla 开发者网络：

setTimeout:

设置一个计时器，该计时器在计时器到期后执行一个函数或指定的代码一次。
setInterval:

重复调用函数或执行代码sn-p，每次调用之间有固定的时间延迟。返回一个区间ID。

您也可以在一段时间后清除setInterval，或者在使用计数器进行多次循环后清除。

一段时间后
假设您要执行 3000 毫秒的循环。然后你可以这样做：

function initChangeText() {
  var time = 2;
  // Store the id to be able to clear it
  var intervalId = setInterval('changeText();', time * 1000);
  // Clear the interval 3000 ms after the interval started
  setTimeout(function() {window.clearInterval(intervalId);}, time * 1000 + 3000);
}

function changeText() {
  // remains the same
}

function changeULText(obj) {
  // remains the same
}
window.onload = initChangeText;

经过多次循环
假设您想准确地执行循环 6 次。你可以这样做：

var loopCount = 0; // Initialize a global counter
var intervalId;  //  Store the ID in the global scope
function initChangeText() {
  var time = 2;
  intervalId = setInterval('changeText();', time * 1000); // Stores the ID
}

function changeText() {
  // Add an if statement to clear the intervalId when
  // the loopCount reaches the limit of 6 repetitions
  if(++loopCount >= 6 && intervalId) {
    window.clearInterval(intervalId);
  }
  // rest of the function remains the same   
}

function changeULText(obj) {
  // remains the same
}
window.onload = initChangeText;

【讨论】：

【解决方案3】：

window.onload = changeText;
或者，如果您想保持初始超时：将setInterval 替换为setTimeout。

【讨论】：