js 多個倒計時,毫秒倒計時

2022-04-03 18:15:54 字數 2216 閱讀 3422

其實主要是借鑑了了這篇文的寫法(俺稍作了修改,以便更適合我的需要:

實現功能:呼叫乙個函式,傳入html元素的id,和乙個截止時間(unix時間戳),在該html元素中列印出到當前到截止時間為止的倒計時,精確到毫秒;

效果圖如下:

h2>毫秒的倒計時

h2>

<

div

id="timer1"

>

div>

<

div

id="timer2"

>

div>

<

div

id="timer3"

>

div>

<

div

id="timer4"

>

div>

<

script

>

varaddtimer

=function

() list.push();

}function

go()

}//傳入unix時間戳,得到倒計時

function

changetimestamp(timestamp)

if(sec

<10)

if(min

<10)

if(hour

<10)

return

hour +"

:"+min +"

:"+sec +"

:"+ms;

}else

}

}();

addtimer(

"timer1",

1451923200

);//

addtimer(

"timer2",

1451926800

);//

1月5日01點

addtimer(

"timer3",

1451930400

);//

1月5日02點

addtimer(

"timer4",

1452020400

);//

1月6日03點

script

>

body

>

html

>

如何使用這個函式?

addtimer("#id",時間戳int);

ps:其實這個函式有乙個小小的問題:就是並不會顯示截止天數;因為老闆表示我們的倒計時時間最多也就幾個小時,所以在判斷倒計時的小時和天數上,我也就懶得寫那麼多了。所以如果傳入的時間戳距今超過了1天。那麼你會看到如此結果:02:11:32:874~~只剩2個小時了!明顯不對是不是?

so,有2個方案這裡:

方法1:把var hour =math.floor(distancetime/1000/60/60%24);改成var hour =math.floor(distancetime/1000/60/60);

如果截止時間距今超出一天了,小時位置會顯示大於24的數字;比如:36:45:22:888

方法2:你自己再寫乙個計算天數的變數;

(其實我覺得毫秒倒計時完全沒有必要,精確到秒就夠了嘛~毫秒這麼快,簡直看得我眼瞎!)

js倒計時,秒倒計時,天倒計時

html 1 html 2 距某某開幕式還有 天 html html html id timer style color red 這次利用系統時間自校驗倒計時,無需手工調校使得倒計時更為精確,及詳細注釋如下 id clock 00 01 11 00 id startb type button val...

倒計時 心跳倒計時

我從悶熱的午後醒來,可還是頭痛得厲害,睡意再次湧上心頭,我告訴自己不能再昏睡下去,於是決定出門去清醒一下。現在的天氣雖說有些燥熱,但是陰涼處還是比較涼爽,我慢慢地走,接著慢跑了起來,夕陽散發著最後一縷餘暉。我邊看著眼前的城市邊際的美景邊深呼吸著,隨著耳機裡傳來的 律動著。突然有個聲音從我腦海裡響起,...

多個倒計時並行 拼團倒計時

本文是對類似於拼團,多個商品每個都有各自的倒計時,一開始接到接到這個需求也是頭疼了一陣子,如果是在商品列表少的時候完全就可以寫成死的,固定的變數,寫幾個定時器就ok了,寫乙個準備渲染的資料,data countdowm timestamp 天 小時 分 秒 if day 0 hour 0 小時 分 ...