将 JavaScript 倒计时转换为 jQuery 倒计时并添加间隔

Question

我在 JSFiddle 找到了this JS-Countdown Script。

编辑：

我现在正在使用rafaelcastrocouto 的代码，这几乎是完美的。我想要一个 10 秒的 JQuery 倒计时脚本，其间隔将倒计时计时器重置为 5 秒并一次又一次地重新开始，但仅限于 具有特定 id的特定类 strong> 在整个 HTML 页面上。如果它下降到 0，倒计时应该停止。我还想将 特定 计数器重置为 10。

这是关于每秒刷新一次的 WebSocket，并且取决于我为特定计数器获得的数据，我想重置它们或者它们应该倒计时到零。

新的 JSFiddle：http://jsfiddle.net/alexiovay/azkdry0w/4/

Answer 1

您的代码中有严重错误，例如

1. setTimeout(cd_go(id), 1000); - 应该指向函数引用而不是函数执行。 setTimeout 还返回超时id。您必须通过 id 才能清除超时

2. clearTimeout(this); 如果您在严格模式

工作，它应该采用 id 而不是全局对象（窗口）或 undefined >

3. loop = setInterval(function(id) { … } - id 指向 未定义，因为您没有为它传递任何值

Answer 2

这就是我使用 jquery 和原生 setInterval 解决的方法...

var setup = function(){
  $('.count').each(eachSetup);    
};

var eachSetup = function(){
  var count = $(this);
  var sec = count.data('seconds') ;  
  count.data('count', sec);
};

var everySecond = function(){  
  $('.count').each(eachCount);    
};

var eachCount = function(){
  var count = $(this);
  var s = count.data('count');
  count.text(s);
  s--;
  if(s < 0) { 
    s = count.data('seconds');
  }
  count.data('count', s);
};

setup();
setInterval(everySecond, 1000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<p class="count" data-seconds="5"></p>
<p class="count" data-seconds="10"></p>
<p class="count" data-seconds="15"></p>