清除之前设置的间隔

时间:2014-07-14 11:19:46

标签: javascript jquery

http://jsfiddle.net/x5MY8/2/

HTML

<div id="easy">easy</div>
<div id="hard">hard</div>

JS

function test(mode) {
    var asd = this;
    this.mode = mode;
    setInterval(function () {
        alert(asd.mode);
    }, 1000);
}

$(document).ready(function () {

    $('#easy').on('click', function () {

        var stuff = new test('easy');


    });
    $('#hard').on('click', function () {

        var stuff = new test('hard');


    });

});

按下easy按钮后,会启动一个每秒钟轻松提醒的事件。如果我之后再按hard,它将启动另一个事件,它会提醒easy, hard, easy, hard..,但我希望它只提醒当前按下的内容,所以我必须以某种方式清除之前的间隔。我怎样才能做到这一点?不知何故,我需要在另一个对象上按下按钮时调用clearInterval,但我真的不知道该怎么做。

3 个答案:

答案 0 :(得分:3)

http://jsfiddle.net/x5MY8/3/

你需要像这样存储和清除间隔

var interval;

function test(mode) {

    var asd = this;
    this.mode = mode;

    if (interval) {
        clearInterval(interval);
    }

    interval = setInterval(function () {
        alert(asd.mode);
    }, 1000);
}

答案 1 :(得分:2)

将其存储在变量中:

var interval = setInterval(function(){
//your code
},1000);

现在,您可以使用clearInterval清除:

clearInterval(interval);

答案 2 :(得分:0)

清除每次点击时的值

 var clear=0;

    function test(mode) {
        var asd = this;
        this.mode = mode;
        clear=setInterval(function () {
            alert(asd.mode);
        }, 1000);
    }

    $(document).ready(function () {

        $('#easy').on('click', function () {
    clearInterval(clear); 
            var stuff = new test('easy');


        });
        $('#hard').on('click', function () {
       clearInterval(clear); 
            var stuff = new test('hard');


        });

    });