当前位置：首页 > 资讯 > 技术文档

基于javascript实现精确到毫秒的倒计时限时抢购

时间：2021-12-12 10:06 编辑：来源：阅读：
扫一扫，手机访问

摘要：基于javascript实现精确到毫秒的倒计时限时抢购

这篇文章为大家分享了javascript实现倒计时限时抢购，精确到毫秒的倒计时，供大家参考，具体内容如下 [b]一、效果图[/b] 下面的图片就是聚划算上面的限时抢的效果 [img]http://files.jb51.net/file_images/article/201604/2016417102127909.jpg?2016317102143[/img] [b]二、实现限时抢的效果需要用到的知识[/b] ：Javascript Date()对象 Date()返回当前的日期和事件 getYear()返回年份获得年最好用 getFullYear()方法来操作(完整格式如2016) getMonth()返回月份值(从0开始,+1) getDay()返回星期几(0-6) getHours()返回小时数(0-23) getMinutes()返回分钟数(0-59) getSeconds()返回秒数 getTime()返回毫秒数当然，上面的调用方法我们不一定全部用到，也要看你自己的需求，废话不多说，我们直接上代码： 1、HTML页面代码： <p class="left-time"></p> 我们把倒计时的内容放在class为left-time的<p>标签内. 2、JS脚本：

$(function(){
  function leftTime(){
    var endTime = new Date("2016/5/20,12:00:00");//结束时间
    var curTime = new Date();//当前时间
    var leftTime = parseInt((endTime.getTime() - curTime.getTime())/1000);//获得时间差
    //小时、分、秒需要取模运算
    var d = parseInt(leftTime/(60*60*24));
    var h = parseInt(leftTime/(60*60)%24);
    var m = parseInt(leftTime/60%60);
    var s = parseInt(leftTime%60);
    var ms = parseInt(((endTime.getTime() - curTime.getTime())/100));
    var txt = "剩余："+d+"天"+h+"小时"+m+"分钟"+s+"."+ms+"秒";
    $(".left-time").text(txt);
    if(leftTime<=0){ $(".left-time").text("团购结束");}
  };
  leftTime();
  var set = setInterval(leftTime,100);
});

上面的js就实现了一个简单的限时抢的小例子，其中parseInt()方法是取整，getTime()把时间转化为毫秒，除了parseInt()方法之外，还可以用Math.floor()向下取整的方法代替. 最后记得不要忘记了给个if()判断时间结束的时候需要显示的内容哦，不然就会出现不必要的小bug哟！

全部评论(0)

上一篇：JS编写函数实现对身份证号码最后一位的验证功能
下一篇：详解JavaScript数组和字符串中去除重复值的方法

资讯排行榜
更多>>