Question

我有一个按钮，点击它会启动一个超时功能，如果在执行该功能之前再次点击它，我希望清除前一个超时因此它可以开始一个新的超时。

演示代码：

<div id='a'>lorem</div>

$('#a').click(function(){
  //code to clear previous timeout
  //This is not working: clearTimeout(timeout);
  var timeout = setTimeout(function(){
   //do something
  },5000);
  return timeout;    
})

我能想到的唯一方法是让timeout全球化，但全球化是丑陋的。

有没有更好的方法呢？在上面的代码中，timeout返回到哪里？我可以在哪个范围内使用它？

Answer 1

您可以在此处使用全局变量的两种替代方法：

1 IIFE创建本地范围：

(function(){
    var timer;
    $('#a').click(function(){
      clearTimeout(timer);
      timer = setTimeout(function(){
          //do something
      },5000);
    })
})();

2 附加到元素的jquery数据

$('#a').click(function(){
  clearTimeout($(this).data('timer'));
  $(this).data('timer', setTimeout(function(){
      //do something
  },5000));
})

如何在jQuery事件处理程序中存储和重用超时？

1 个答案: