Question

让我说我这样做：

$("#content").load(...);

在我正在加载的内容中包含一些javascript：

var myCounter = 0;
var myInterval = setInterval(function(){
   myCounter++;

   $("#counter-display").html("Count: "+myCounter);
});

由于未知原因，如果我用$（“＃content”）重新加载内容.load（...）; - myInterval现在被调用两次。

我尝试过这样的事情：

if (myInterval !== undefined){
   //dont set interval again
}

然而，它不起作用。有没有人知道任何方法，以便在.load上清除myInterval，而不需要将javascript放在加载的文件之外？

Answer 1

尝试在计数器元素上保留数据对象中的间隔和计数，如下所示：

var disp = $("#counter-display");
if(!disp.data("interval")) {
  disp.data("interval", setInterval(function() {
    var count = (disp.data("count") || 0) + 1;
    disp.data("count", count).html("Count: " + count);
  }, 500));
}

一次更多的代码，但对全局变量更清晰等等。

Answer 2

您的代码正在执行两次。

在声明变量之前尝试检查if (typeof myInterval !== "undefined")。

Answer 3

您可能会发现myInterval正在某个本地范围内定义。

尝试使用：

var myCounter = 0;
myInterval = setInterval(function(){
   myCounter++;

   $("#counter-display").html("Count: "+myCounter);
});

myInterval现在将在全局范围内声明。

您当然可以使用clearInterval，并执行clearInterval(myInterval)，这也将确保仅在使用间隔的实例上。

Javascript - Jquery .load（）和setInterval（）问题

3 个答案: