包含 setInterval 的方法之外的 clearInterval答案

【问题标题】：clearInterval outside of method containing setInterval包含 setInterval 的方法之外的 clearInterval
【发布时间】：2012-02-12 23:58:51
【问题描述】：

我有一个可以在同一页面上多次调用的消息传递函数。每次调用时，屏幕顶部都会出现一条新消息，并具有由递增的全局设置的唯一 ID。

函数的大致思路如下：

var messageTimer = function(msgid, duration) {
  ...
  var interval = setInterval(
    function() {
    ...
    },
    duration
  )
};

在上面的代码中，创建了一条新消息并应用了一个计时器。如果计时器用完，消息就会消失。但是，如果在除关闭按钮之外的任何位置单击消息，则计时器应停止并且消息应保持直到手动关闭。

如何找到被点击的消息框的间隔ID？可能有 3 个其他盒子同时打开。

$('body').on('click', '.msg', function() {

});

由于我只有一个类来触发点击，我想找到它的唯一可能方法是为消息框的 ID 设置一个附加字段？但是这种方法似乎没有必要而且很麻烦。

【问题讨论】：

显然你必须在某处存储interval。如果您只有一个（或少量）这样的间隔并行，您可以简单地使用全局变量（或数组或对象）。

标签： javascript jquery setinterval

【解决方案1】：

我会在存储间隔 ID 的消息上设置一个数据属性：

var messageTimer = function(msgid, duration) {
  ...
  var interval = setInterval(
    function() {
    ...
    },
    duration
  );
  $("#" + msgid).data("i", interval);
};

然后在点击你的消息时回忆它：

$('body').on('click', '.msg', function() {
    clearInterval(parseInt($(this).data("i"), 10));
});

【讨论】：

经过更多思考后，我想这确实是唯一的选择。感谢您的帮助。

【解决方案2】：

您使用的是 html5 吗？您可以将自定义数据属性添加到您的节点。此功能的 javascript API 描述为 here。

【讨论】：