JavaScript 倒计时

最新推荐文章于 2019-12-04 19:52:36 发布

xyphf_和派孔明

最新推荐文章于 2019-12-04 19:52:36 发布

阅读量707

点赞数 1

分类专栏：数据处理文章标签： javascript 函数

本文链接：https://blog.csdn.net/xyphf/article/details/77671791

版权

数据处理专栏收录该内容

56 篇文章 1 订阅

订阅专栏

JS倒计时DEMO，距离2017年国庆节还有多长时间倒计时?

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>倒计时js代码 还剩多少天</title>
<script type="text/javascript">
    function getRTime(){
        var EndTime= new Date('2017/10/01 00:00:00'); 
        var NowTime = new Date();
        var t =EndTime.getTime() - NowTime.getTime();
        var d=Math.floor(t/1000/60/60/24);
        var h=Math.floor(t/1000/60/60%24);
        var m=Math.floor(t/1000/60%60);
        var s=Math.floor(t/1000%60);

        document.getElementById("t_d").innerHTML = d + "天";
        document.getElementById("t_h").innerHTML = h + "时";
        document.getElementById("t_m").innerHTML = m + "分";
        document.getElementById("t_s").innerHTML = s + "秒";
    }
    setInterval(getRTime,1000);
</script>
</head>
<body>
距离2017年国庆节还有
<div id="CountMsg" class="HotDate">
    <span id="t_d">00天</span>
    <span id="t_h">00时</span>
    <span id="t_m">00分</span>
    <span id="t_s">00秒</span>
</div>
</body>
</html>

点击倒计时60秒

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>倒计时60秒</title>
<input type="button" id="btn" value="免费获取验证码" />
<script type="text/javascript">
var wait=60;
function time(o) {
        if (wait == 0) {
            o.removeAttribute("disabled");            
            o.value="免费获取验证码";
            wait = 60;
        } else {
            o.setAttribute("disabled", true);
            o.value="重新发送(" + wait + ")";
            wait--;
            setTimeout(function() {
                time(o)
            },
            1000)
        }
    }
document.getElementById("btn").onclick=function(){time(this);}
</script>
</body>
</html>

JQ倒计时

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>倒计时60秒</title>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<input type="button" id="btn" value="免费获取验证码" />  
<script>
$(function() {  
    $(function() {  
        $("#btn").click(settime);  
    });  
});  
var countdown = 60;  
function settime() {  
    if(countdown == 0) {  
        $("#btn").attr("disabled", false);  
        $("#btn").attr("value", "免费获取验证码");  
        countdown = 60;  
    } else {  
        $("#btn").attr("disabled", true);  
        $("#btn").attr("value", "重新发送(" + countdown + ")");  
        countdown--;  
    }  
    setTimeout(settime, 1000)  
}  
</script>
</body>
</html>

xyphf_和派孔明

关注

1
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
JavaScript 倒计时

JS倒计时DEMO，距离2017年国庆节还有多长时间倒计时?<!doctype html><html><head> <meta charset="utf-8"> <title>倒计时js代码还剩多少天</title><script type="text/javascript"> function getRTime(){ var EndTime= new
复制链接

扫一扫