Question

当我点击按钮计时器时，我正在与计时器一起工作，从5秒开始，当它达到0时逐渐消失。我试过但无法得到，这是我尝试过的小提琴：http://jsfiddle.net/GNrUM/937/

<div id="hideMsg" style="display:none;">
This Box will Close In <span>5</span> Seconds..</div>
<input id="take" type="button"  value="click me" >

jQuery代码：

$("#take").live("click", function () {
    $('#hideMsg').show();
    var sec = $('#hideMsg span').text()
    var timer = setInterval(function () {
        $('#hideMsg span').text(--sec);
        if (sec == 0) {
            $('#hideMsg').fadeOut('fast');
            clearInterval(timer);
        }
    }, 1000);
});

当点击2次计数从0，-1，-2开始时，它首次点击效果很好。它没有清除间隔。有什么帮助吗？

Answer 1

一旦淡出，你必须重置值

 $('#hideMsg span').text(5);

JS小提琴演示demo

Answer 2

尝试重新初始化$('#hideMsg span')。比如$('#hideMsg span').text('5');

http://jsfiddle.net/GNrUM/941

Answer 3

试试这个：

 $("#take").live("click",function(){  
    $('#hideMsg').show();    
    var sec = $('#hideMsg span').text()
    var timer = setInterval(function() { 
       $('#hideMsg span').text(--sec);
       if (sec == 0) {
          $('#hideMsg').fadeOut('fast');
           $('#hideMsg span').text("5"); // reinitialize the span value
          clearInterval(timer);
       } 
    }, 1000);
    });

jQuery倒计时器问题

3 个答案: