jQuery队列事件？

问题描述

| 实际上，我找不到此问题的确切标题。但是我可以描述一下，以便您了解我的需求。 说我有一个button＃pressme，我想将click事件处理程序绑定到它。在函数处理程序内部，我将使用Ajax从服务器获取一些数据，然后解析数据以更新div＃status的文本，例如：从N / A到更新/未更新。因为数据总是在变化，所以我想添加另一个函数将div＃status更改回N / A。 这是我达到此目的的目的：

 $(\"button#pressme\").bind(\"click\",function(){
           $.ajax{(
                   type:\"POST\",.....
                   success: function (xml,status) {
                     .....
                     $(\"div#status\").text(\"updated\");
                     setTimeout(function(){$(\"div#status\").text(\"N/A\")},20000);
                   },error: ....
                  )};
  });

这似乎按我的计划工作，因为文本将在20秒后变回\“ N / A \”。但是，我发现存在一个问题：如果用户一直单击按钮：说用户单击按钮1st将文本更改为\“ updated \”，然后在18秒后再次单击以将文本更改为\“ not Updated \” ”。然后，仅在2秒后，文本将更改回\“ N / A \”，因为执行了第一个setTimeout函数。 如果我想记住用户的上次单击，并且仅在用户最后一次单击后20秒钟更新div的文本？如何轻松实现呢？ 谢谢！     

解决方法

         保留计时器的句柄：

timerId = setTimeout(...);

每次重新启动计时器时，请先清除旧的计时器：

clearTimeout(timerId);

例如。：

$(\"button#pressme\").bind(\"click\",function() {
       var that = this;
       $.ajax{(
               type:\"POST\",.....
               success: function (xml,status) {
                 var timerId = $(that).data(\'timerId\');
                 .....
                 $(\"div#status\").text(\"updated\");
                 if (timerId) { 
                     clearTimeout(timerId);
                 }
                 timerId = setTimeout(function(){$(\"div#status\").text(\"N/A\")},20000);
                 $(that).data(\'timerId\',timerId)
               },error: ....
              )};
  });

编辑已更新，以显示使用jQuery

.data()

方法存储和检索基于每个元素的timerId。