首页 > 代码库 > jQuery控制倒计时
jQuery控制倒计时
1.1 秒杀的倒计时
做秒杀网页总免不了倒计时，但没有很好的服务器，啥资源都没有，只能将部分任务交给浏览器去处理，比如秒杀首页的倒计时，因为真正秒杀是在具体页面，首页只是展示而已，所以误差一点是允许的。
而在具体商品页，时间要求比较严谨，可以通过每秒向服务器提交信息核实，也可以通过隔时间段提交，核对并确保时间无误（误差较小）。
1.2 jQuery控制倒计时示例
1 $(document).ready(function() { 2 onTimer("#time",12000); 3 }); 4 5 // 该函数用于执行倒计时 6 function onTimer(id, time) { 7 // 将传进来的long型转换成秒 8 var remainingTime = time / 1000; 9 var hour = 0;10 var minute = 0;11 var second = 0;12 13 // 需要将其句柄赋予一个变量，方便清除该事件14 var stopCountDown = setInterval(countDown, 1000);15 16 function countDown() {17 if(remainingTime > 0) {18 // 如果倒计时大于0，则继续倒计时19 hour = Math.floor(remainingTime / 3600);20 minute = Math.floor(Math.floor(remainingTime % 3600) / 60);21 second = Math.floor(remainingTime % 60);22 var formatTime = numToDate(hour, minute, second); 23 changeShowTime(id, formatTime);24 remainingTime--;25 26 /* 这里可用Ajax提交到服务器的 */27 28 }else {29 // 若倒计时为0，则清除事件30 clearInterval(stopCountDown);31 32 /* 这里可用Ajax提交到服务器的 */33 }34 }35 }36 37 // 将数字转换成时间格式，如： 09:30:4538 function numToDate(hour, minute, second) {39 var tohour = hour < 10 ? ("0" + hour) : hour;40 var tominute = minute < 10 ? ("0" + minute) : minute;41 var tosecond = second < 10 ? ("0" + second) : second;42 return tohour + ":" + tominute + ":" + tosecond;43 }44 45 // 该函数用于显示倒计时46 function changeShowTime(id,time) {47 /* 该函数内编写显示倒计时的语句 */48 ///////////////////////////////////////////////////////49 50 $(id).html(time); 51 }
1.3 关于多个商品倒计时
一般往往不止一个商品需要倒计时，而商品的信息又是从服务端迭代出来的，我们需要一个可以识别的标志，所以可在迭代时加入其ID，如下：
1 <!-- 以上，略 -->2 3 <s:iterator value=http://www.mamicode.com/"M_list" status="boxes"> 4 <div id="goods_<s:property value=http://www.mamicode.com/"sid"/>" class="show_box float_left">5 6 <!-- 略 -->7 8 </div>9 </s:iterator>
这时的问题便是如何拿到每个ID并为其加上之前写好的方法，可以通过each(callback)方法，该方法以每一个匹配的元素作为上下文来执行一个函数。
1 $(document).ready(function) {2 /* 以上，略 */3 4 $("div[class *= show_box]").each(function(){5 var id = $(this).attr("id"); 6 7 /* 这里编写要绑定的事件，略 */ 8 }9 }
jQuery控制倒计时
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。