码迷,mamicode.com
首页 > Web开发 > 详细

js 倒计时小练习

时间:2015-04-29 18:52:04      阅读:97      评论:0      收藏:0      [点我收藏+]

标签:

涉及到一些date对象的操作,还有setInterval之类的基础知识。

 

题目还是IFE得js的课堂小练习。

要求:输入一个日期,然后计算出时间差,然后就这个时间差开始倒计时,时间到则倒计时停止。

 

html部分就简单的输入输出:

    <div>stage 2</div>
    <input type="date" style="width:400px;" id="text" />
    <input type="button" value="提交" id="submit" />
    <div style="border:1px" id="show"></div>

js部分如下:

可能代码不怎么规范,比如在循环里有var之类的,先实现了功能吧。

    $(document).ready(function(){
            $("#submit").click(function(){
                var date = $("#text").val();
                var dates = date.split("-");

                var date = new Date();
                date.setFullYear(dates[0],dates[1]-1,dates[2]);
                date = date.getTime();

                var song=setInterval(function(){
                            var nowDate = new Date();
                            nowDate = nowDate.getTime();
                            var a = Math.abs(nowDate-date);

                            if(a==0){
                                clearInterval(song);
                            }
                            var days=Math.floor(a/(24*3600*1000));
                            var b = a%(24*3600*1000);
                            var hours=Math.floor(b/(3600*1000));
                            var c = b%(3600*1000);
                            var minutes=Math.floor(c/(60*1000));
                            var d = c%(60*1000);
                            var seconds = Math.floor(d/(1000));
                            $("#show").html(days+"天"+hours+"时"+minutes+"分"+seconds+"秒");

                        },1000);
                

            })
            
        })

 

js 倒计时小练习

标签:

原文地址:http://www.cnblogs.com/wangsong1299/p/4466346.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!