今天做移動端商城時候得，需要哥秒殺計時器，從後臺獲取了時間以後，前臺做相應的判斷。需要的可以直接拿去用，本人只精確到了x天x小時x分鐘x秒。其他需要可以自行添加。<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta na ...
今天做移動端商城時候得，需要哥秒殺計時器，從後臺獲取了時間以後，前臺做相應的判斷。需要的可以直接拿去用，本人只精確到了x天x小時x分鐘x秒。
其他需要可以自行添加。
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
.setting-time{
display: none;
}
.time{
width: 80%;
height: 100px;
margin: 0 auto;
background: black;
color: #fff;
display: flex;
justify-content: space-between;
}
.time span{
width:25%;
height: 100%;
font-size: 20px;
line-height: 100px;
text-align: center;
}
</style>
</head>
<body>
<!--模擬後臺取回來的數據，格式為30日12點0時0分，如需年月日，可以自己添加-->
<div class="setting-time">
<div class="last_d">30</div>
<div class="last_h">12</div>
<div class="last_f">0</div>
<div class="last_s">0</div>
</div>
<!--倒計時時間-->
<div class="time">
<span id="t_day"></span>
<span id="t_hour"></span>
<span id="t_minute"></span>
<span id="t_second"></span>
</div>
</body>
<script src="https://libs.baidu.com/jquery/1.7.2/jquery.min.js"></script>
<script>
function timeDown(){
//當前時間
var myDate = new Date();
var date=myDate.getDate()*24*60*60; //獲取日期
var h=myDate.getHours()*60*60; //獲取當前小時數(0-23)
var m=myDate.getMinutes()*60; //獲取當前分鐘數(0-59)
var s=myDate.getSeconds()*1; //獲取當前秒
var now=date+h+m+s;//當前時間總秒數
//後臺設置時間
var day2=$(".last_d").text()*24*60*60; //獲取設置的天 比如28日
var xs=$(".last_h").text()*60*60; //獲取設置的小時
var fz=$(".last_f").text()*60; //獲取設置的分鐘
var mz=$(".last_s").text()*1; //獲取設置的秒
var last=day2+xs+fz+mz; //後臺設置時間的總秒數
var limit_time=last-now; //計算差
var day=Math.floor(limit_time/60/60/24); //換算成正常日期
var hour=Math.floor(limit_time/60/60%24);
var minutes=Math.floor(limit_time/60%60);
var seconds=Math.floor(limit_time%60);
$("#t_day").html(day+"天"); /*寫到頁面中*/
$("#t_hour").html(hour+"時");
$("#t_minute").html(minutes+"分");
$("#t_second").html(seconds+"秒");
if(limit_time==10){
alert("提醒，還有10秒結束");
}
--limit_time;
window.name=limit_time;//記錄當前時間。
}
timer=setInterval("timeDown()",1000);//設置定時器，1秒鐘執行一次timeDown()函數；
</script>
</html>
