javascript實(shí)現(xiàn)搶購(gòu)倒計(jì)時(shí)程序
本文實(shí)例為大家分享了javascript實(shí)現(xiàn)搶購(gòu)倒計(jì)時(shí)的具體代碼,供大家參考,具體內(nèi)容如下
倒計(jì)時(shí)分為三種狀態(tài):
1) 未到搶購(gòu)開(kāi)始時(shí)間,顯示:搶票倒計(jì)時(shí)××天××?xí)r××分××秒
2) 開(kāi)始搶購(gòu),顯示:搶票還?!痢撂臁痢?xí)r××分××秒
3) 搶購(gòu)?fù)戤叄@示:本輪搶購(gòu)結(jié)束
搶購(gòu)的起始時(shí)間和截止時(shí)間,可以通過(guò)C#代碼輸出。
此代碼兼容其它瀏覽器。
<div id="clientclock">
</div>
<br />
<br />
<br />
<br />
<mce:script type="text/javascript"><!--
//搶票起始時(shí)間 2011年2月29日10點(diǎn)10分0秒,月份的定義從0開(kāi)始,因此1表示2月份。
var start = new Date('2011', '1', '29', '10', '10', '00');
//var start = new Date('2011','1', '28', '15', '10', '00');
//搶票截止時(shí)間 2011年2月29日11點(diǎn)10分59秒
var expire = new Date('2011', '1', '29', '11', '10', '59');
//顯示倒計(jì)時(shí)的HTML對(duì)象
var clock = document.getElementById('clientclock');
//倒計(jì)時(shí)函數(shù),每秒執(zhí)行一次
setLeftTime();
function setLeftTime() {
var now = new Date();
//如果當(dāng)前時(shí)間小于搶票起始時(shí)間,那么顯示:搶票倒計(jì)時(shí)××天××?xí)r××分××秒
if (now < start) {
var diff = -480 - now.getTimezoneOffset() //是北京時(shí)間和當(dāng)?shù)貢r(shí)間的時(shí)間差
var lefttime = (start.getTime() - now.getTime()) + diff * 60000
var day = Math.floor(lefttime / (1000 * 60 * 60 * 24));
var hour = Math.floor(lefttime / (1000 * 3600)) - (day * 24);
var minute = Math.floor(lefttime / (1000 * 60)) - (day * 24 * 60) - (hour * 60);
var second = Math.floor(lefttime / (1000)) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
clock.innerHTML = '搶票倒計(jì)時(shí):<span class="ztCopy">' + day + '</span>天 <span class="ztCopy">' + hour + '</span>時(shí) <span class="ztCopy">' + minute + '</span>分 <span class="ztCopy">' + second + '</span>秒';
}
//如果當(dāng)前時(shí)間大于等于搶票起始時(shí)間,小于搶票截止時(shí)間,即:正在搶票,那么顯示:搶票還?!痢撂臁痢?xí)r××分××秒
else if (now <= expire) {
var diff = -480 - now.getTimezoneOffset() //是北京時(shí)間和當(dāng)?shù)貢r(shí)間的時(shí)間差
var lefttime = (expire.getTime() - now.getTime()) + diff * 60000
var day = Math.floor(lefttime / (1000 * 60 * 60 * 24));
var hour = Math.floor(lefttime / (1000 * 3600)) - (day * 24);
var minute = Math.floor(lefttime / (1000 * 60)) - (day * 24 * 60) - (hour * 60);
var second = Math.floor(lefttime / (1000)) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
clock.innerHTML = '搶票還剩:<span class="ztCopy">' + day + '</span>天 <span class="ztCopy">' + hour + '</span>時(shí) <span class="ztCopy">' + minute + '</span>分 <span class="ztCopy">' + second + '</span>秒';
}
//如果當(dāng)前時(shí)間大于搶票截止時(shí)間,即:本輪搶票結(jié)束,那么顯示:本輪搶購(gòu)結(jié)束
else {
clock.innerHTML = '本輪搶購(gòu)結(jié)束';
}
setTimeout("setLeftTime()", 1000);
}
// --></mce:script>
更多關(guān)于倒計(jì)時(shí)的文章請(qǐng)查看專(zhuān)題:《倒計(jì)時(shí)功能》
更多JavaScript時(shí)鐘特效點(diǎn)擊查看:JavaScript時(shí)鐘特效專(zhuān)題
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- JS 倒計(jì)時(shí)實(shí)現(xiàn)代碼(時(shí)、分,秒)
- JS實(shí)現(xiàn)倒計(jì)時(shí)(天數(shù)、時(shí)、分、秒)
- 簡(jiǎn)單易用的倒計(jì)時(shí)js代碼
- 2種簡(jiǎn)單的js倒計(jì)時(shí)方式
- js代碼實(shí)現(xiàn)點(diǎn)擊按鈕出現(xiàn)60秒倒計(jì)時(shí)
- js幾秒以后倒計(jì)時(shí)跳轉(zhuǎn)示例
- js實(shí)現(xiàn)點(diǎn)擊獲取驗(yàn)證碼倒計(jì)時(shí)效果
- 原生JS實(shí)現(xiàn)簡(jiǎn)單的倒計(jì)時(shí)功能示例
- 一個(gè)不錯(cuò)的js html頁(yè)面倒計(jì)時(shí)可精確到秒
- Javascript倒計(jì)時(shí)代碼
相關(guān)文章
javascript下使用Promise封裝FileReader
這篇文章主要介紹了javascript下使用Promise封裝FileReader,需要的朋友可以參考下2016-02-02
(function(){})()的用法與優(yōu)點(diǎn)
(function(){})()的用法與優(yōu)點(diǎn)...2007-03-03
js點(diǎn)擊頁(yè)面其它地方將某個(gè)顯示的DIV隱藏
今天一朋友問(wèn)我 點(diǎn)擊一按鈕彈出一個(gè)DIV,然后要求點(diǎn)擊頁(yè)面其它地方隱藏這個(gè)DIV2012-07-07
原生JS面向?qū)ο髮?shí)現(xiàn)打磚塊小游戲
這篇文章主要為大家詳細(xì)介紹了原生JS面向?qū)ο髮?shí)現(xiàn)打磚塊小游戲,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-09-09
JavaScript電子時(shí)鐘倒計(jì)時(shí)
這篇文章主要介紹了JavaScript電子時(shí)鐘倒計(jì)時(shí)的實(shí)現(xiàn)代碼,具有一定的參考價(jià)值,感興趣的朋友可以參考一下2016-01-01
VsCode插件自動(dòng)生成注釋插件koroFileHeader使用教程
這篇文章主要介紹了VsCode插件自動(dòng)生成注釋插件koroFileHeader使用教程,本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2023-01-01
Highcharts 非常實(shí)用的Javascript統(tǒng)計(jì)圖demo示例
官網(wǎng)實(shí)例中給出了各式各樣的demo,可以參照document修改自己需要的即可,本文實(shí)現(xiàn)的是一個(gè)學(xué)生成績(jī)走勢(shì)demo,有需求的朋友可以參考下哈,希望對(duì)大家有所幫助2013-07-07
JS實(shí)現(xiàn)網(wǎng)頁(yè)滾動(dòng)條感應(yīng)鼠標(biāo)變色的方法
這篇文章主要介紹了JS實(shí)現(xiàn)網(wǎng)頁(yè)滾動(dòng)條感應(yīng)鼠標(biāo)變色的方法,實(shí)例分析了javascript針對(duì)鼠標(biāo)事件的操作技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-02-02
Bootstrap文件上傳組件之bootstrap fileinput
這篇文章主要介紹了Bootstrap文件上傳組件之bootstrap fileinput,重點(diǎn)是把界面做得更加友好,更好的增加用戶(hù)體驗(yàn)。還有還多注意細(xì)節(jié)大家可以通過(guò)本文詳細(xì)了解下2016-11-11

