javascript / jquery倒计时器与JSfiddle的例子？ [英] javascript/jquery countdown timer with JSfiddle example?

问题描述

我正在制作一些东西，其中一个是倒数计时器，倒计时永远不会超过一个小时，所以我需要做的就是倒数分钟和秒。

I am building a few things and one of them is a countdown timer, the countdown will never be over an hour so all I need to do is countdown minutes and seconds.

我有部分工作，但问题是前导零。我让它在几秒钟内完成工作但没有分钟。

I have it partially working, but the problem is with the leading zeros. I got it to work in the seconds but not with the minutes.

查看我的示例 http://jsfiddle.net/cgweb87/GHNtk/

JavaScript

setInterval(function() {
var timer = $('span').html();
timer = timer.split(':');
var minutes = timer[0];
var seconds = timer[1];
seconds -= 1;
if (minutes < 0) return;
if (minutes < 10 && length.minutes != 2) minutes = '0' + minutes;
if (seconds < 0 && minutes != 0) {
    minutes -= 1;
    seconds = 59;
}
else if (seconds < 10 && length.seconds != 2) seconds = '0' + seconds;
    $('span').html(minutes + ':' + seconds);
}, 1000);

HTML

<span>10:10</span>

我想要的是倒数计时器可以在1小时内开始，它会倒数前导零，即以这种格式;

What I want to happen is the countdown timer can begin anywhere under 1 hour, it will count down with leading zeros ie in this format;

08:49
46:09

08:49 46:09

当它出现时到达倒计时只是显示：

And when it reaches the countdown to simply just display:

00:00

感谢您的任何输入，我不知道我想要使​​用插件，我想学习它。

Thanks for any input, and I don't want to use plugins, I want to learn it.

推荐答案

setInterval 返回您稍后可以使用的身份 clearInterval ：

setInterval returns an identity you can use later to clearInterval:

var interval = setInterval(function() {
    /* snip */
    $('span').html(minutes + ':' + seconds);

    if (parseInt(minutes, 10) == 0 && parseInt(seconds, 10) == 0)
        clearInterval(interval);
}, 1000);

并且，为了避免不断增加的分钟 - 00000001：42 - 或者：

And, to avoid the ever-increasing minutes -- 00000001:42 -- either:

1. 将 length.minutes 更改为前缀测试中的 minutes.length 。


2. 检索时将值转换为Numbers - var minutes = parseInt（timer [0]，10）; - 只测试 if（minutes< 10）... 。

1. change length.minutes to minutes.length in your prefix test.
2. cast the values to Numbers when retrieving -- var minutes = parseInt(timer[0], 10); -- and just test if (minutes < 10) ....

选择＃2，这是一个更新： http：// jsfiddle .net / BH8q9 /

Taking option #2, here's an update: http://jsfiddle.net/BH8q9/

这篇关于javascript / jquery倒计时器与JSfiddle的例子？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！