导致Javascript错误的倒计时结束情况

Question

我有一个简单的倒计时插件，它可以一秒一秒地倒计时，到达该时间后，它会运行我选择的回调函数。

我今天发现，如果我在同一页上有两个倒计时，而一个倒计时结束，就会发生javascript错误，因为变量变得未定义，这也会破坏第二个倒计时。

这是代码：

(function($) {
$.fn.countdown = function(options, callback) {
var $self = $(this);
var settings = {
'date' : null,
}
if(options) {
$.extend(settings, options);
}
function countdownProcessor() {
var eventDate = Date.parse(settings.date) / 1000;
var currentDate = Math.floor($.now() / 1000);
if (eventDate <= currentDate) {
callback.call(this);
clearInterval(interval);
}
var secondsBetween = eventDate - currentDate;
// processing logic here.
}
countdownProcessor();
interval = setInterval(countdownProcessor, 1000);
}
})(jQuery);

问题在于if语句，该语句用于检查以确保日期尚未发生：

if (eventDate <= currentDate) {
callback.call(this);
clearInterval(interval);
}    

当这个条件为true时，回调成功完成，但clearInterval没有成功，因为变量interval没有定义——这是因为倒计时函数在声明间隔之前运行。

我尝试过通过切换间隔变量声明和countdownProcessor();来修复它，但这并没有帮助，因为它只会导致第一个结束的倒计时计数为负数。

我还有一些其他方法，比如更改某些代码的声明范围和顺序，但它总是导致倒计时，要么是a)计数为负数，要么是B)

我该怎么解决这个问题？

Answer 1

添加var:

var interval = setInterval(countdownProcessor,1000);

这使得interval对正在运行的每个倒计时都是本地的，而不是对整个页面全局的。