京東秒殺倒計時
分類: jQuery
【轉載】頁面中多個倒計時（仿電商列表頁面產品倒計時）
|
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 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 |
<script type="text/javascript" src="jquery-1.7.2.min.js"></script> <script type="text/javascript"> //添加timer標識 var obj ={}; $(function(){ $("div[end!='']").each(function(){ var timerDiv = $(this).attr("id"); obj[timerDiv] = new Date($(this).attr("end")); obj[timerDiv].minilions = obj[timerDiv].getTime(); //var obj[timerDiv].timer; if(obj[timerDiv].timer){ clearInterval(obj[timerDiv].timer); } obj[timerDiv].timer = setInterval(function(){ var currentTime = new Date(); $("#currentTimer").html( currentTime.getFullYear()+"/"+currentTime.getMonth()+"/"+currentTime.getDate()+" "+ currentTime.getHours()+":"+currentTime.getMinutes()+":"+currentTime.getSeconds()); timecount(obj[timerDiv],timerDiv); },1000); }); }) function timecount(currentTimer,timerDiv){ var distance = currentTimer -new Date(); var hourse = 60*60*1000; var minutes = 60*1000; var seconds= 1000; var mhour = parseInt(distance/hourse); var mminu = parseInt((distance-mhour*hourse)/minutes); var msecond = parseInt((distance-mhour*hourse-mminu*minutes)/seconds); var str = mhour+":"+mminu+":"+msecond; $("#"+timerDiv).html(str); if(mhour==0 && mminu==0 && msecond==0 || (msecond<0)){ clearInterval(obj[timerDiv].timer); $("#"+timerDiv).html("時間到!"); } } </script> 當前時間: <div id="currentTimer" style="background-color: blue;"></div> 截止時間:2015/02/19 18:56:30 剩餘時間： <div id="timer" style="background-color: pink;"></div> 截止時間:2015/01/28 19:59:16 剩餘時間： <div id="timer2" style="background-color: yellow;"></div> 截止時間:2015/02/24 14:23:10 剩餘時間： <div id="timer3" style="background-color: orange;"></div> |
說明：
首先引入Jquery庫，使用對象封裝屬性的方式來區分不同的定時器~
———————
作者：iteye_15064
来源：CSDN
原文：https://blog.csdn.net/iteye_15064/article/details/82613223
版权声明：本文为博主原创文章，转载请附上博文链接！