点击后重复调用函数

Question

我的代码有什么问题，我只想在点击时调用一个函数，然后每 5 秒重复一次？

$("#ref").on("click", ".mc", function(event) {
   var ref_id = $(this).attr('ref_id');
      return getRef(ref_id);
      window.setInterval(function(ref_id){
       getRef(ref_id);
      }, 5000);
});

以及如何在二次点击时删除 setInterval？

感谢任何提示！

Answer 1

我的代码有什么问题

您的代码永远不会到达对setInterval 的调用，因为您的

return getRef(ref_id);

行结束函数。

如何删除二次点击时的 setInterval？

通过记住您是否有一个正在运行。 setInterval 返回一个“计时器句柄”，这是一个不是 0 的数字，您可以使用它来关闭它。所以你可以使用一个变量，初始化为0，来记住你是否有一个定时器正在运行（并记住句柄以便你可以关闭它）：

(function() {
    // A handle for setInterval, 0 = not set
    var timer = 0;

    $("#ref").on("click", ".mc", function(event) {
       if (timer) {
          // Timer is set, cancel it
          clearInterval(timer);
          timer = 0;
       }
       else {
          // Timer is not set, set it
          var ref_id = $(this).attr('ref_id');
          // No `return` on the next line, it ends the function
          getRef(ref_id);
          timer = window.setInterval(function(ref_id){
             getRef(ref_id);
          }, 5000);
       }

       // If you need to return something from the click (for instance,
       // `false`), do so here
    });
})();

在上面我假设你在停止计时器时根本不想打电话给getRef。

Answer 2

函数中return getRef(ref_id); 之后的所有内容都将被忽略。

您可能应该删除 return 关键字。