javascript - 暂停并继续使用 setInterval

原文 标签 javascript jquery html

我想要实现的是当您单击此 href <a href="javascript:void(0)" class="pauser">pause/continue</a> 时计时器暂停并在再次按下时继续。

<script>
$(document).ready(function () {
    var counter = 10;
    var id = setInterval(function() {
       counter--;
       if(counter > 0) {
            var msg = 'You can continue ' + counter + ' seconds';
            $('#notice').text(msg);
       } else {
            $('#notice').hide();
            $('#download').show();
            clearInterval(id);
      }
    }, 1000);
});
</script>

如果您需要,我的与 jQuery 相关的 HTML 在这里。
<a href="http://myurl.com" id="download" class="button" style="display: none;font-size:30px;">Continue !!</a><p id="notice">
You can continue in 10 seconds</p>

最佳答案

好吧,我只想让您的暂停事件设置一个 bool 值,然后在减少计数器之前检查该 bool 值:

<a href="javascript:setPause();" class="pauser">pause/continue</a>


var ispaused=false;
function setPause(){
   ispaused=!ispaused;
}


$(document).ready(function () {
var counter = 10;
var id = setInterval(function() {
   if(!ispaused){ ////the only new line I added from your example above
     counter--;
     if(counter > 0) {
          var msg = 'You can continue ' + counter + ' seconds';
          $('#notice').text(msg);
     } else {
          $('#notice').hide();
          $('#download').show();
          clearInterval(id);
    }
  }
}, 1000);
});

应该可以吧?

关于javascript - 暂停并继续使用 setInterval,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8159191/

相关文章:

javascript - 如何将 google Closure 命名空间添加到 Javascript 类

javascript - 播放或暂停音频时切换图标

css - div 内的超链接,在 HTML/CSS 中的标签内分配了一个类

jquery - 带有单独的div的段落?

javascript - “this” 、 “$this” 和 “$(this)” 之间有什么区别?

javascript - 使用setInterval将变量随时间递增

javascript - 如何隐藏首页上的一组按钮? vue.js

jquery - 如何在 <body> 下移动脚本引用

javascript - 如何在Javascript代码之前获取php POST代码以运行?

javascript - jQuery 从 <li> 获取对象值并更改 <li> 类属性