當前位置:
首頁 >
前端技术
> javascript
>内容正文
javascript
javascript 学习笔记(四) 倒计时程序
生活随笔
收集整理的這篇文章主要介紹了
javascript 学习笔记(四) 倒计时程序
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
首先看全部完整代碼: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>countDown test</title><script type="text/javascript">function countDown(endDate) {var now = new Date();var deadtime = document.getElementById(endDate);var deadline = new Date(deadtime.value);//本地時間與格林威治標準時間 (GMT) 的分鐘差var timeDiff = now.getTimezoneOffset();//此處有些不解,如果把分鐘差轉化成毫秒應該是timeDiff*60*1000,但是這樣返回的數據不正確!var leave = Math.abs(deadline.getTime() - now.getTime() + timeDiff*60);var minute = 1000 * 60;var hour = minute * 60;var day = hour * 24;var countDay = Math.floor(leave/day);//var countHour = Math.floor((leave - day*countDay)/hour); 兩種計算思路var countHour = Math.floor(leave/hour - countDay*24);var countMinute = Math.floor(leave/minute) - countDay*24*60 - countHour*60;var countSecond = Math.floor(leave/1000) - countDay*24*60*60 - countHour*60*60 - countMinute*60;var outStr = "";if(deadline < now) {outStr = "距離"+deadtime.value+"已有"+countDay+"天"+countHour+"小時"+countMinute+"分"+countSecond+"秒";} else {outStr = "距離"+deadtime.value+"還差"+countDay+"天"+countHour+"小時"+countMinute+"分"+countSecond+"秒";}var showTime = document.getElementById("showTime");showTime.innerHTML = outStr;}
</script>
</head><body>
<p><label for="deadline">截止日期</label><input type="text" value="2011-06-11" id="deadline" /><input type="button" value="開始倒計時" οnclick="window.setInterval('countDown(\'deadline\')', 1000)" /></p>
<p id="showTime"></p>
</body>
</html>
html部分代碼: 可在文本框中輸入倒計時的時間,如果當前時間小于截止時間,則正常返回,反之,則返回距離截止日期到現在的時間 <p><label for="deadline">截止日期</label><input type="text" value="2011-06-11" id="deadline" /><input type="button" value="開始倒計時" οnclick="window.setInterval('countDown(\'deadline\')', 1000)" />
</p>
<p id="showTime"></p>
javascript部分代碼: function countDown(endDate) {var now = new Date();var deadtime = document.getElementById(endDate);var deadline = new Date(deadtime.value);//本地時間與格林威治標準時間 (GMT) 的分鐘差var timeDiff = now.getTimezoneOffset();//此處有些不解,如果把分鐘差轉化成毫秒應該是timeDiff*60*1000,但是這樣返回的數據不正確!var leave = Math.abs(deadline.getTime() - now.getTime() + timeDiff*60);var minute = 1000 * 60;var hour = minute * 60;var day = hour * 24;var countDay = Math.floor(leave/day);//var countHour = Math.floor((leave - day*countDay)/hour); 兩種計算思路var countHour = Math.floor(leave/hour - countDay*24);var countMinute = Math.floor(leave/minute) - countDay*24*60 - countHour*60;var countSecond = Math.floor(leave/1000) - countDay*24*60*60 - countHour*60*60 - countMinute*60;var outStr = "";if(deadline < now) {outStr = "距離"+deadtime.value+"已有"+countDay+"天"+countHour+"小時"+countMinute+"分"+countSecond+"秒";} else {outStr = "距離"+deadtime.value+"還差"+countDay+"天"+countHour+"小時"+countMinute+"分"+countSecond+"秒";}var showTime = document.getElementById("showTime");showTime.innerHTML = outStr;}
轉載于:https://www.cnblogs.com/webw3c/archive/2011/04/05/2006089.html
總結
以上是生活随笔為你收集整理的javascript 学习笔记(四) 倒计时程序的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Torchlight(火炬之光)人物骨骼
- 下一篇: Excel 操作收藏