如何停止setInterval？

Question

<span id="ccc">10</span> <span id="start">start</span> <span id="stop">stop</span>

$('#start').click(function(){
    var c = $('#ccc').text();
         var inter =   setInterval(function() {
                    c--;
                    $('#ccc').text(c);
            }, 1000);
}); 

$('#stop').click(function(){
     clearInterval(inter);
    });

如何重写这个以正确使用STOP？

现场： http ： //jsfiddle.net/c3hZh/

Answer 1

inter需要在两个功能范围内。 使用闭包来包装这两个函数，以便您可以避免使用新变量污染全局命名空间。

(function ($) {
  var inter;

  $('#start').click(function(){
    var c;
    c = parseInt($('#ccc').text()); //make sure you're getting a numeric value
    //don't forget to clear any existing interval before setting a new one:
    if (inter) {
      clearInterval(inter);
    }
    inter = setInterval(function() {
      c--;
      $('#ccc').text(c);
    }, 1000);
  });

  $('#stop').click(function() {
    clearInterval(inter);
  });
}(jQuery));

Answer 2

inter是一个局部变量。
它在回调之外不存在。

您需要使用全局变量。

Answer 3

var inter = 0;
$('#start').click(function(){
    var c = $('#ccc').text();
         inter =   setInterval(function() {
                    c--;
                    $('#ccc').text(c);
            }, 1000);
}); 

$('#stop').click(function(){
     clearInterval(inter);
    });