js 实现倒计时功能,兼容ios,类似京东
【摘要】
效果
html
<div class="weui-cell count_down">
<div class="weui-cell__bd">
<...
效果
html
<div class="weui-cell count_down">
<div class="weui-cell__bd">
<p>秒杀中,抢到就是赚到</p>
</div>
<div class="weui-cell__ft">距结束
<span class="num">00</span>:
<span class="num">00</span>:
<span class="num">00</span>
</div>
</div>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
js
function antitime() {
var time="2018-09-04 21:08:49";
var to = new Date(time.replace(/-/g, "/"));
var now = new Date();
var deltaTime = to.getTime() - now.getTime();
//超时就停止倒计时
if (deltaTime <= 0) {
window.clearInterval(timer);
return;
}
var d= deltaTime / (1000 * 60 * 60 * 24);
var h = Math.floor(deltaTime / 1000 / 60 / 60 % 24);
var m = Math.floor(deltaTime / 1000 / 60 % 60);
var s = Math.floor(deltaTime / 1000 % 60);
//把时间的数字转成字符串, 如果时分秒不足10, 则前面补0
var timeStr = ""+ (h/10>=1?h=h:h="0"+h) + (m/10>=1?m=m:m="0"+m) + (s/10>=1?s=s:s="0"+s);
//console.log(timeStr);
//each循环遍历.num元素
$(".weui-cell__ft .num").each(function(index, span) {
$(span).html(timeStr.substring(index, index+2));
if(index==1) $(span).html(timeStr.substring(2, 4));
if(index==2) $(span).html(timeStr.substring(4, 6));
//$(span).html();这个方法是用来设置span里面的值的
});
}
//每秒执行一次
var timer = setInterval(antitime, 1000);
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
.replace(/-/g, "/")
是进行转换,目的就是兼容ios
文章来源: blog.csdn.net,作者:yechaoa,版权归原作者所有,如需转载,请联系作者。
原文链接:blog.csdn.net/yechaoa/article/details/82388219
【版权声明】本文为华为云社区用户转载文章,如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱:
cloudbbs@huaweicloud.com
- 点赞
- 收藏
- 关注作者
评论(0)