如何清除所有的间隔?

时间:2022-10-27 19:17:44

I am using

我用

varName = setInterval(function() { ... }, 1000);

to set a couple of intervals in a jquery plugin that I'm writing, but when the plugin is reloaded I need to clear those intervals. I tried storing them in variables, like this:

要在我正在编写的jquery插件中设置几个间隔,但是当插件重新加载时,我需要清除这些间隔。我尝试将它们存储在变量中,比如:

(function($){
$.mosaicSlider = function(el) {
    var base = this;        
    var transitionInterval, mainInterval;

...

base.init = function() {
    mainInterval = setInverval(function() { ... }, 1000);
}

base.grid = function() {
    this.transition() = function() {
         transitionInterval = setInterval(function(...) {
    }
}

base.init();

And I tried killing those intervals in the base.init() function, like this:

我尝试在base.init()函数中删除这些间隔,如下所示:

clearInterval(transitionInterval);
clearInterval(mainInterval);

And like this:

就像这样:

window.oldSetInterval = window.setInterval;
window.setInterval = new function(func, interval) {  }

3 个解决方案

#1


39  

You could do like,

你可以做,

var interval_id = window.setInterval("", 9999); // Get a reference to the last
                                                // interval +1
for (var i = 1; i < interval_id; i++)
        window.clearInterval(i);
//for clearing all intervals

#2


49  

Store 'em in an object. Since you're the only one making these intervals, and you know what they are, you can store them and later mess with them as you wish. I'd create an object dedicated for just that, something like:

将它们存储在一个对象中。因为你是唯一一个做这些间隔的人,而且你知道他们是什么,你可以把他们储存起来,然后按照你的意愿把它们弄乱。我将为此创建一个对象,比如:

var interval = {
    //to keep a reference to all the intervals
    intervals : {},

    //create another interval
    make : function ( fun, delay ) {
        //see explanation after the code
        var newInterval = setInterval.apply(
            window,
            [ fun, delay ].concat( [].slice.call(arguments, 2) )
        );

        this.intervals[ newInterval ] = true;

        return newInterval;
    },

    //clear a single interval
    clear : function ( id ) {
        return clearInterval( this.intervals[id] );
    },

    //clear all intervals
    clearAll : function () {
        var all = Object.keys( this.intervals ), len = all.length;

        while ( len --> 0 ) {
            clearInterval( all.shift() );
        }
    }
};

Your first question might be

你的第一个问题可能是

Why make a separate object for just that?

为什么要做一个单独的对象呢?

Well Watson, it's to keep your hand-made intervals related to your plugin/project away from prying eyes, so you won't mess with other intervals being set in the page not related to your plugin.

好吧,沃森,它是为了让你手工制作的与你的插件/项目相关的间隔不被人窥探,所以你不会弄乱页面上与你的插件无关的其他间隔设置。

Yes, but why can't I store it inside the base object?

是的,但是为什么我不能将它存储在基对象中呢?

You most certainly can, but I think this way is much cleaner. It separates the logic you do in your base with the weird timeout logic.

你当然可以,但我认为这样更简洁。它用奇怪的超时逻辑将你在你的基中做的逻辑分离开来。

"Why did you store the intervals inside an object and not an array?"

“为什么要将间隔存储在对象中而不是数组中呢?”

Faster access and a little bit of cleaner code. You can go either way, really.

更快的访问和一些更简洁的代码。你可以走任何一条路,真的。

What's this .apply and all these weird array thingies inside of make?"

这个。apply和make里面的这些奇怪的数组是什么?

setInterval also accepts a list of arguments to be passed to the function. Function.prototype.apply is beyond the scope of this question, but here's a semi-explanation for it.

setInterval还接受要传递给函数的参数列表。Function.prototype。apply超出了这个问题的范围,但是这里有一个半解释。

You're cheating! You used ES5 features! I don't want that, I want ES3 compatibility

你作弊!你用ES5功能!我不想那样,我想要ES3的兼容性

You got me. Object.keys is indeed ES5. However, you can easily replace that with a for in loop, or if you feel super-adventurous (for future clarification and protocol, that was sarcasm), shim it.

你明白我的意思。对象。确实是ES5钥匙。但是,您可以很容易地用for in循环替换它,或者如果您觉得非常冒险(对于未来的澄清和协议,这是讽刺),那么就把它填满。

#3


5  

Intialize Timer and set it as window object. Window.myInterval will hold the ID of the Timer.

初始化计时器并将其设置为窗口对象。窗口。myInterval将保存计时器的ID。

like window.myInterval=setInterval(function() { console.log('hi'); }, 1000);

像window.myInterval = setInterval(函数(){ console.log(“嗨”);},1000);

To clear Interval you can write like

要清除Interval,可以这样写

if(window.myInterval!=undefined&&window.myInterval!='undefined'){
window.clearInterval(window.myInterval);
alert('Timer cleared with id'+window.myInterval);
}

#1


39  

You could do like,

你可以做,

var interval_id = window.setInterval("", 9999); // Get a reference to the last
                                                // interval +1
for (var i = 1; i < interval_id; i++)
        window.clearInterval(i);
//for clearing all intervals

#2


49  

Store 'em in an object. Since you're the only one making these intervals, and you know what they are, you can store them and later mess with them as you wish. I'd create an object dedicated for just that, something like:

将它们存储在一个对象中。因为你是唯一一个做这些间隔的人,而且你知道他们是什么,你可以把他们储存起来,然后按照你的意愿把它们弄乱。我将为此创建一个对象,比如:

var interval = {
    //to keep a reference to all the intervals
    intervals : {},

    //create another interval
    make : function ( fun, delay ) {
        //see explanation after the code
        var newInterval = setInterval.apply(
            window,
            [ fun, delay ].concat( [].slice.call(arguments, 2) )
        );

        this.intervals[ newInterval ] = true;

        return newInterval;
    },

    //clear a single interval
    clear : function ( id ) {
        return clearInterval( this.intervals[id] );
    },

    //clear all intervals
    clearAll : function () {
        var all = Object.keys( this.intervals ), len = all.length;

        while ( len --> 0 ) {
            clearInterval( all.shift() );
        }
    }
};

Your first question might be

你的第一个问题可能是

Why make a separate object for just that?

为什么要做一个单独的对象呢?

Well Watson, it's to keep your hand-made intervals related to your plugin/project away from prying eyes, so you won't mess with other intervals being set in the page not related to your plugin.

好吧,沃森,它是为了让你手工制作的与你的插件/项目相关的间隔不被人窥探,所以你不会弄乱页面上与你的插件无关的其他间隔设置。

Yes, but why can't I store it inside the base object?

是的,但是为什么我不能将它存储在基对象中呢?

You most certainly can, but I think this way is much cleaner. It separates the logic you do in your base with the weird timeout logic.

你当然可以,但我认为这样更简洁。它用奇怪的超时逻辑将你在你的基中做的逻辑分离开来。

"Why did you store the intervals inside an object and not an array?"

“为什么要将间隔存储在对象中而不是数组中呢?”

Faster access and a little bit of cleaner code. You can go either way, really.

更快的访问和一些更简洁的代码。你可以走任何一条路,真的。

What's this .apply and all these weird array thingies inside of make?"

这个。apply和make里面的这些奇怪的数组是什么?

setInterval also accepts a list of arguments to be passed to the function. Function.prototype.apply is beyond the scope of this question, but here's a semi-explanation for it.

setInterval还接受要传递给函数的参数列表。Function.prototype。apply超出了这个问题的范围,但是这里有一个半解释。

You're cheating! You used ES5 features! I don't want that, I want ES3 compatibility

你作弊!你用ES5功能!我不想那样,我想要ES3的兼容性

You got me. Object.keys is indeed ES5. However, you can easily replace that with a for in loop, or if you feel super-adventurous (for future clarification and protocol, that was sarcasm), shim it.

你明白我的意思。对象。确实是ES5钥匙。但是,您可以很容易地用for in循环替换它,或者如果您觉得非常冒险(对于未来的澄清和协议,这是讽刺),那么就把它填满。

#3


5  

Intialize Timer and set it as window object. Window.myInterval will hold the ID of the Timer.

初始化计时器并将其设置为窗口对象。窗口。myInterval将保存计时器的ID。

like window.myInterval=setInterval(function() { console.log('hi'); }, 1000);

像window.myInterval = setInterval(函数(){ console.log(“嗨”);},1000);

To clear Interval you can write like

要清除Interval,可以这样写

if(window.myInterval!=undefined&&window.myInterval!='undefined'){
window.clearInterval(window.myInterval);
alert('Timer cleared with id'+window.myInterval);
}