Question

当我尝试将其绑定到按钮单击时，我遇到了使clearInterval工作的问题。此外，显然该功能是从它开始的......这是我的代码

var funky = setInterval(function() {
    alert('hello world');
}, 2000);

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

Here's a js fiddle

Answer 1

您忘记添加jquery库并进行了错误的分配，它需要在回调函数内部。

工作示例：

＆＃13;

var funky;

$('#start').click(function() {
  funky = setInterval(function() {
    alert('hello world');
  }, 2000);
});

$('#stop').click(function() {
    clearInterval(funky);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="start">start</button>
<button id="stop">stop</button>

＆＃13;

Answer 2

首先，是的，当你为一个函数赋一个变量时，它会自行调用。

其次，您的点击事件无法正常工作，因为您需要在点击时将时间间隔分配给变量，而不是调用该功能 - 没有任何要调用的功能，正如您在查看开发人员控制台时所看到的那样。

最后，最好将jQuery代码包装在文档就绪函数中，以确保所有事件处理程序都能正确绑定。

$(function () {
  var funky;
  $('#start').click(function() {
    funky = setInterval(function() {
      alert('hello world');
    }, 1000);
  });

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

Answer 3

您正在保存错误的值。试试这个：

var funky = function() {
    alert('hello world');
}

var funkyId = setInterval(funky, 2000);

$('#start').click(function() {
    funky();
});
$('#stop').click(function() {
    clearInterval(funkyId);
});

Answer 4

在这里，我给你个主意。

声明一个变量，例如let x;
创建要与setInterval绑定的函数。例如 function funky() { alert("Hello World"); }
将start.onclick分配给将setInterval分配给x的函数。例如start.onclick = function(){ clearInterval(x); // to prevent multiple interval if you click more than one x = setInterval(funky, 2000); // assign the setInterval to x };
将stop.onclick分配给clearInterval(x)以停止间隔。例如stop.onclick = function() { clearInterval(x); // to stop the interval };

就是这样。容易吧。

单击按钮的Javascript clearInterval

4 个答案: