Question

我有一个秒表功能，可以通过开始/停止按钮切换。按下停止按钮时，计时器停止，jQuery将一行插入预先加载到页面上的表中。

我在后台运行另一个jQuery脚本，不断更新该表以保持新数据。它本质上是一个计时员。

但是，我遇到的问题是，当用户按下停止按钮时，setInterval加载会继续运行，导致添加的jquery字段消失。

我尝试添加一个变量来检查停止按钮是否被按下，如果是，则停止事件...但由于它已经加载到DOM中，所以它似乎不起作用。这是当前的代码：

            $.ajax({
                url: 'getData.php',
                success: function(data) {
                    $("#timesheet").html(data);
                }
            });

            var refreshId = setInterval(function() {
                $.ajax({
                    url: 'getData.php?randval='+ Math.random(),
                    success: function(data) {
                        $("#timesheet").html(data);
                    }
                });
            }, 9000);

这是ajax正在加载的HTML数据：

<table>
<tr><th>Test</th></tr>
<tr><td>Test</td></tr>
</table>

我也试过在tr：last上使用append，但是只是将它附加到tr ...而不是创建一个新的tr。

TL; DR：我希望setInterval不会覆盖jQuery在按下按钮时添加的字段，但似乎无法这样做，因为它被编码为更改整个表。

感谢您的任何建议。

Answer 1

没有内置的.Pause API，但您可以将其停止，然后使用相同的功能启动新的时间间隔。

像clearInterval之类的东西，然后重新设置它。

Answer 2

ClearInterval explained

$('#button').click(function()
 {
     clearInterval(refreshId);
 });

Answer 3

var MyApp ={
 animationID: null,
 speed : 200,
 setAnimation:function(state){
         var obj=this;
         if(state)obj.animationID=setInterval(function() { 
             //your code
             },obj.speed);
         else {
             clearInterval(obj.animationID);
             }
         }
}

开始

MyApp.setAnimation(true);

停止

MyApp.setAnimation(false);

在事件期间暂停setInterval？

3 个答案: