Question

好吧，在我的imgInt函数中，我正在调用另一个函数＆＃34; nextPhoto＆＃34;从内部。虽然当我使用mouseOut我的图像元素时，我想回想起imgInt虽然我不知道如何调用它或者我可能必须将任何参数传递给它。

var imgInt = setInterval(function(){
    nextPhoto("next");
}, 2000);

image.addEventListener("mouseover", function(){
    clearInterval(imgInt);
    this.addEventListener("onmouseout", function(){
        setInterval(imgInt);
    }, false);
}, false);

Answer 1

您无法通过将其传递到setInterval来重新启动上一个间隔。定义一个启动间隔的函数，然后调用它。

var imgInt;
function startInterval() {
    imgInt = setInterval(function(){
        nextPhoto("next");
    }, 2000);
}
startInterval();
image.addEventListener("mouseover", function() {
    clearInterval(imgInt);
});
image.addEventListener("mouseout", function() {
    startInterval();
});

在另一个侦听器函数中添加一个事件侦听器几乎总是错误的，因为每次第一个事件发生时它都会创建多个侦听器。

Answer 2

就像@Barmar先生的回复一样。

setInterval()方法返回唯一的时间间隔ID（ timeoutID ）。

WindowOrWorkerGlobalScope mixin的setInterval（）方法反复调用函数或执行带有固定的代码片段每次通话之间的时间延迟。它返回唯一的区间ID 识别间隔，以便稍后通过调用将其删除 clearInterval（）。

此方法将Function视为第一个参数，后跟延迟（以毫秒为单位），以及可选的N个参数，这些参数将在计时器到期后传递给作为第一个参数传递的函数。

var intervalID = scope.setInterval(func, delay[, param1, param2, ...]);

＆＃13;

(function() {

  var imgInt,
    image = document.querySelector("img");

  function startInterval() {
    imgInt = setInterval(function(param1, param2) {
        //               ^^^^^^^  ^^^^^^  ^^^^^^ ^
        //              Function  param1  param2 N
        //nextPhoto("next");
        console.log(imgInt);
        //          ^^^^^^
        //     numeric timeoutID
        console.log(param1, param2);
        //          ^^^^^^  ^^^^^^
        //       "MyParam1"    2
      }, 2000,
      // ^^^^
      // delay
      "MyParam1", 2);
    // ^^^^^^    ^^^
    // param1   param2
  }
  image.addEventListener("mouseover", function() {
    clearInterval(imgInt);
  });
  image.addEventListener("mouseout", function() {
    startInterval();
  });
})();

＆＃13;

<img src="//placehold.it/170?text=hover me" alt="Please mouseover this photo then mouseout wait 2 seconds then repeat.">

＆＃13;

调用SetInterval函数表达式

2 个答案: