js倒计时,WebYang.NET- IT技术博客

js倒计时

AndyYang| 阅读：1041 发表时间：2011-11-28 04:57:00 js

摘要：这是我随便写的，实现倒计时，然后把花费的时间记录在影藏域中。因为我对js不熟，我今天刚开始找了很多，发现在倒计时的都可以出现负数，简直是误人子弟。各位，一定要加clearInterval(timmer)啊..

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script src="jquery-1.5.1.js" language="javascript"></script>
<script language="JavaScript">
var TotalMilliSeconds = 5*1000;
$(document).ready(function() {
    timmer = setInterval("takeCount()",1000);
    $('.button').click(function() {
        $('#ceshi').attr("value",timmer);
        clearInterval(timmer);
    });
});
 
function takeCount()
 {
    //计数减一
     TotalMilliSeconds -= 1000;
     if(TotalMilliSeconds == 0) {
         clearInterval(timmer);
         alert('time over');
     }
    //计算时分秒
    var hours = Math.floor( TotalMilliSeconds / ( 1000 * 60 * 60 )) % 24;
    var minutes = Math.floor(TotalMilliSeconds / (1000 * 60)) % 60;
    var seconds = Math.floor(TotalMilliSeconds / 1000) % 60;
    //将时分秒插入到html中
    document.getElementById("RemainH").innerHTML = hours;
    document.getElementById("RemainM").innerHTML = minutes;
    document.getElementById("RemainS").innerHTML = seconds; 
    $('#jquery').html(seconds);
 }
</script>
</head>
<body>
<div id="CountMsg">
倒计时还有：
<strong id="RemainD"></strong><strong id="RemainH">XX</strong>时
<strong id="RemainM">XX</strong>分
<strong id="RemainS">XX</strong>秒
 
jquery
<strong id="jquery">XX</strong>秒
<input type="hidden" id="ceshi" value="">
<input type="button" value="停止" class="button">
</div>
</body>
</html>