Javascript 如何使用Jquery停止setInterval计时器

Im使用带有jquery的setInterval（）每隔2秒从网络摄像头加载和刷新图片，如本例所示：

$("cameralist").change(function(){
    $("cameralist option:selected").each(function(){
        var timer = setInterval(loadImage(), 2000); 

        function loadImage(){
            $("div.img").attr("src", URL); 
        }
    });
});

我的问题是，我想清除每一个更改事件的计时器（每次在列表中选择新的或其他摄影机时），然后重新启动计时器

我该怎么做？有什么想法吗

如何使用Jquery停止SetInterval计时器

你没有。但您可以使用JavaScript来实现这一点：

clearInterval(timer);

不过，您需要将

计时器

变量置于

更改

处理程序之外。最初我还将其设置为

0

（使用

0

调用

clearInterval

是不可操作的，因此它是一个方便的初始值）

还要注意，您没有正确设置间隔。这一行：

var timer = setInterval(loadImage(),2000);

调用

loadImage

并将其返回值传递到

setInterval

，与

foo（bar（））

调用

bar

并将其返回值传递到

foo

。要查看该功能，请在

loadImage

之后删除

（）

大致如下：

// Note: I'm assuming this code isn't at global scope. If it is, wrap it in a
// scoping function, we don't want or need `timer` to be global.
var timer = 0; // <== Initialize timer variable
$("cameralist").change(function () {

    $("cameralist option:selected").each(function () {

        clearInterval(timer); // <=== Clear previous timer if any
        timer = setInterval(loadImage, 2000); // <=== Set new timer
        // No () here ---------------^

        function loadImage() {
            $("div.img").attr("src", URL);
        }
    });
});

//注意：我假设此代码不在全局范围内。如果是的话，用塑料袋包起来
//作用域函数，我们不希望或不需要'timer'是全局的。
变量计时器=0；// 不需要jquery，可以使用原始javascript

clearInterval(timer)

像这样使用

$("cameralist").data().timer = null;

$("cameralist").change(function(){


  $("cameralist option:selected").each(function(){

       clearInterval($("cameralist").data().timer);
       $("cameralist").data().timer = setInterval(loadImage(),2000); 

       function loadImage(){

         $("div.img").attr("src", URL); 

       }
  });

});

$("cameralist").data().timers = [];

$("cameralist").change(function(){
  _.each($("cameralist").data().timers, function(timer) {
      setInterval(timer);
  });
  $("cameralist").data().timers = [];

  $("cameralist option:selected").each(function(){
       var timerRef = setInterval(loadImage(),2000); 
       $("cameralist").data().timers.push(timerRef);

       function loadImage(){

         $("div.img").attr("src", URL); 

       }
  });

});

如果要清除计时器负载

像这样使用

$("cameralist").data().timer = null;

$("cameralist").change(function(){


  $("cameralist option:selected").each(function(){

       clearInterval($("cameralist").data().timer);
       $("cameralist").data().timer = setInterval(loadImage(),2000); 

       function loadImage(){

         $("div.img").attr("src", URL); 

       }
  });

});

$("cameralist").data().timers = [];

$("cameralist").change(function(){
  _.each($("cameralist").data().timers, function(timer) {
      setInterval(timer);
  });
  $("cameralist").data().timers = [];

  $("cameralist option:selected").each(function(){
       var timerRef = setInterval(loadImage(),2000); 
       $("cameralist").data().timers.push(timerRef);

       function loadImage(){

         $("div.img").attr("src", URL); 

       }
  });

});


同样，伟大的思想也是一样的：）+1对下面的人来说
把计时器作为全局变量不是个好主意

/**
 * It is not good idea to have timer
 * as s global variable.
 */

$("cameralist").change((function (timer) {
    return function () {
        if (timer != null) {
            clearInterval(timer);
        }
        $("cameralist option:selected").each(function () {
            timer = setInterval(loadImage, 2000);
            function loadImage() {
                $("div.img").attr("src", URL);
            }
        });
    }
})(null));

clearInterval（计时器）
？第一个问题：
setInterval（loadImage（），2000）
将立即调用
loadImage
。谢谢T.J.Crowder。我从servlet获取图片，图片必须每2秒更改一次…谢谢aqm。这是可行的，但只有一个计时器将被清除！如何在每次选择cameralist时清除所有计时器？（启动了很多计时器：每个选定的摄像头一个）啊，我会使用一个计时器数组，创建一个clearAllTimers函数，该函数将清除所有计时器，然后用一个新的空计时器数组替换计时器数组，每次创建新计时器时，只需将计时器推入数组，ps我想你实际上想要setTimeout，它类似于setInterval，但只触发一次->谢谢aqm，它可以工作！