標籤：interval java text style tle size res src char
1 <html> 2 <head> 3 <meta charset="utf-8"/> 4 <title>jquery實現倒計時</title> 5 <script src="js/jquery-1.8.3.min.js" type="text/javascript"></script> 6 </head> 7 8 <body> 9 <div id="remainTime" style="font-size:20px;font-weight:800;color:#FF9900"></div> 10 11 <script type="text/javascript">12 $(function(){13 var now=new Date();14 var end=new Date(2018,2,3,16,10,00);//結束的時間：年，月，日，分，秒（月的索引是0~11）15 /*兩個時間相減,得到的是毫秒ms,變成秒*/16 var result=Math.floor(end-now)/1000; 17 18 var interval=setInterval(sub,1000); //定時器 調度對象19 /*封裝減1秒的函數*/20 function sub(){21 if (result>1) {22 result = result - 1; 23 var second = Math.floor(result % 60); // 計算秒 ，取餘 24 var minite = Math.floor((result / 60) % 60); //計算分 ，換算有多少分，取餘，餘出多少秒25 var hour = Math.floor((result / 3600) % 24); //計算小時，換算有多少小時，取餘，24小時制除以24，餘出多少小時26 var day = Math.floor(result / (3600*24)); //計算天 ，換算有多少天27 28 $("#remainTime").html(day + "天" + hour + "小時" + minite + "分" + second + "秒");29 } else{30 alert("倒計時結束！");31 window.clearInterval(interval);//這裡可以添加倒計時結束後需要執行的事件 32 }33 };34 });35 </script>36 </body>37 </html>
jquery實現倒計時
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
