从60开始倒计时，以5为增量

Question

我找到了几个答案，但肯定有一些我不理解的地方。

我需要以5秒为增量放置x1分钟v，比如60到55，再到50，以此类推。

执行此操作的页面是从php/ajax加载数据，但我不知道这部分是否存在冲突。

这就是我所拥有的：

var counter = 60;
$('#seks').html(counter);
var interval = setInterval(function() {
    counter=counter-5;
    $('#seks').fadeOut(slow).html(counter).fadeIn(slow);.
    if (counter == 5) {
        clearInterval(interval);
    }
}, 5000);

来自数据库的间隔函数更新，如下所示：

setInterval(function() {

    var fadeInData = function fadeInData() { $('#updateshere').fadeIn(); }
    var loadData = function loadData() {    $('#updateshere').load('http://launchpad-001.com/_firingRange/danTestPageHits/', fadeInData); }
    $('#updateshere').fadeOut(loadData);   
}, 60000);  

我知道这很简单，我有更复杂的东西在运行，你可以在这个链接上看到一些，我需要把这个倒计时时钟放在这里。

但是，一定有一些我不知道的东西，因为我不能让它工作。

下面是要更新的html：

<div id="seks"></div>

对我来说，这看起来应该行得通。

$(document).ready(function(){
    var counter = 60;

    $('#seks').html(counter);
    var interval = setInterval(function() {
        counter=counter-5;
        $('#seks').fadeOut(slow).html(counter).fadeIn(slow);.
        if (counter == 5) {
            clearInterval(interval);
        }
    }, 5000);
 });

Answer 1

您的尝试很接近，但没有考虑使用来自fx队列调用(fadeIn，fadeOut)的回调的想法。还要记住，slow需要是字符串"slow"，因为这是jquery所期望的，而不是引用变量的slow (假设您在某个地方没有var slow = 1000 )。

$(document).ready(function(){
 var counter = 60;

 var seks = $('#seks').html(counter);//save copy to reduce querying
 var interval = setInterval(function() {
    counter -= 5;
    seks.fadeOut('slow',function(){//use callback after animation
     seks.html(counter).fadeIn('slow');//now fade back in once out is done
    });
    if (counter == 5) {
        clearInterval(interval);
    }
 }, 5000);
});