這篇文章為大家分享了javascript實(shí)現(xiàn)倒計(jì)時(shí)限時(shí)搶購(gòu),精確到毫秒的倒計(jì)時(shí),供大家參考,具體內(nèi)容如下
一、效果圖
下面的圖片就是聚劃算上面的限時(shí)搶的效果
二、實(shí)現(xiàn)限時(shí)搶的效果需要用到的知識(shí) :Javascript Date()對(duì)象
Date()返回當(dāng)前的日期和事件
getYear()返回年份 獲得年最好用
getFullYear()方法來操作(完整格式如2016)
getMonth()返回月份值(從0開始,+1)
getDay()返回星期幾(0-6)
getHours()返回小時(shí)數(shù)(0-23)
getMinutes()返回分鐘數(shù)(0-59)
getSeconds()返回秒數(shù)
getTime()返回毫秒數(shù)
當(dāng)然,上面的調(diào)用方法我們不一定全部用到,也要看你自己的需求,廢話不多說,我們直接上代碼:
1、HTML頁(yè)面代碼:
<p class="left-time"></p>
我們把倒計(jì)時(shí)的內(nèi)容放在class為left-time的<p>標(biāo)簽內(nèi).
2、JS腳本:
$(function(){ function leftTime(){ var endTime = new Date("2016/5/20,12:00:00");//結(jié)束時(shí)間 var curTime = new Date();//當(dāng)前時(shí)間 var leftTime = parseInt((endTime.getTime() - curTime.getTime())/1000);//獲得時(shí)間差 //小時(shí)、分、秒需要取模運(yùn)算 var d = parseInt(leftTime/(60*60*24)); var h = parseInt(leftTime/(60*60)%24); var m = parseInt(leftTime/60%60); var s = parseInt(leftTime%60); var ms = parseInt(((endTime.getTime() - curTime.getTime())/100)%10); var txt = "剩余:"+d+"天"+h+"小時(shí)"+m+"分鐘"+s+"."+ms+"秒"; $(".left-time").text(txt); if(leftTime<=0){ $(".left-time").text("團(tuán)購(gòu)結(jié)束");} }; leftTime(); var set = setInterval(leftTime,100);});
上面的js就實(shí)現(xiàn)了一個(gè)簡(jiǎn)單的限時(shí)搶的小例子,其中parseInt()方法是取整,getTime()把時(shí)間轉(zhuǎn)化為毫秒,除了parseInt()方法之外,還可以用Math.floor()向下取整的方法代替.
最后記得不要忘記了給個(gè)if()判斷時(shí)間結(jié)束的時(shí)候需要顯示的內(nèi)容哦,不然就會(huì)出現(xiàn)不必要的小bug喲!
新聞熱點(diǎn)
疑難解答
圖片精選
網(wǎng)友關(guān)注