javascript - 过早触发 javascript setTimeOut 事件

Question

我正在使用 setTimeOut 来控制自动幻灯片放映。

(你可以在这里看到它:http://thingist.com/labs/ipad.shtml——基本上是我工作时可以看到的漂亮东西。图片来自 reddit 的 API)

代码大概是这样的:

next() {
   image_url = images[key]["url"]
   $("#image").html(vsprintf("<img src='%s'>", [image_url]));
   key++;
   setTimeOut(function() { next(); }, 30000);

问题是，如果我以另一种方式触发“下一步”函数(例如使用 div onclick)，setTimeOut 回调函数仍然在排队。所以我将“下一个”图像，但是当回调触发时，它再次“下一个”图像。如果您连续多次“下一步”，则会有大约 30 秒的延迟爆发跟随您。 (一旦所有排队的超时都触发)。

有没有办法提前触发 setTimeOut 的回调？或者只是完全出列？

Answer 1

您可以使用 clearTimeout()清除先前设置的超时。

var timeout;
function next() {
   image_url = images[key]["url"]
   $("#image").html(vsprintf("<img src='%s'>", [image_url]));
   key++;
   timeout = setTimeout(function() { next(); }, 30000);
}

// Clear the timeout by calling clearTimeout()
window.clearTimeout(timeout);