首页 > 代码库 > jQuery实现倒计时效果-杨秀徐
jQuery实现倒计时效果-杨秀徐
本实例效果：剩余368天22小时39分57秒结束
代码简单易懂，适用各种倒计时；
<!DOCTYPE html><head> <title>jQuery实现倒计时效果-杨秀徐</title> <script type="text/javascript" src="http://www.mamicode.com/scripts/jquery.js"></script> <script type="text/javascript"> /* @作者：杨秀徐，主页 http://www.gzmsg.com @用途：jQuery实现倒计时效果$(".time").countDown({time: "2015/12/1 10:00:00",type:0}) @参数：time: 结束时间,type:显示方式（0显示天数，1不显示天数） */ $.fn.countDown = function (opt) { var opt = $.extend({ time : null, type : 0 }, opt); var edtime = new Date(opt.time).getTime(), //月份是实际月份-1 edsecond = (edtime - new Date().getTime()) / 1000; var eday = $(this).find(‘.day‘), ehour = $(this).find(‘.hour‘), eminute = $(this).find(‘.minute‘), esecond = $(this).find(‘.second‘); var timer = setInterval(function () { if (edsecond > 1) { edsecond -= 1; var day = Math.floor((edsecond / 3600) / 24), hour = Math.floor((edsecond / 3600) % 24), minute = Math.floor((edsecond / 60) % 60), second = Math.floor(edsecond % 60); if(opt.type===0){ $(eday).text(day); //计算天 $(ehour).text(hour < 10 ? "0" + hour : hour); //计算小时 }else{ hour = day * 24; $(ehour).text(hour < 10 ? "0" + hour : hour); //计算小时-没有天数 } $(eminute).text(minute < 10 ? "0" + minute : minute); //计算分钟 $(esecond).text(second < 10 ? "0" + second : second); //计算秒杀 } else { clearInterval(timer); } }, 1000); } $(function () { $(".time").countDown({ time: "2015/12/1 10:00:00", type:0 }); }); </script></head><body> <div class="time">剩余<span class="day">0</span>天<span class="hour">00</span>小时<span class="minute">00</span>分<span class="second">00</span>秒结束</div></body></html>
jQuery实现倒计时效果-杨秀徐
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。