適合php+js的動態倒計時腳本源碼

一、html代碼通過div來動態顯示倒計時的結果

<div id="djs"></div>

<input type="text" value="2016-07-29 10:00:00"? id="time"/>

二、第二段代碼是用來設置頁面加載就調用這個倒計時的js 方法djstest();

$(document).ready(function(){

djstest();

})

三、第三段代碼是 真正的通過js來動態的轉換php的時間,此處時間為2016-07-29 10:00:00 這個格式。

//倒計時

function djstest(){

// 當前時間

var nowTime = new Date().getTime();

// 2016/12/22 hh:mm:ee

// 結束時間

var endTime = new Date(document.getElementById('time').value);

// 相差的時間

var t = endTime.getTime() - nowTime;

if(t<=0){

document.getElementById('djs').innerHTML ="活動已結束";

return false;

}

var d = Math.floor(t/1000/60/60/24);

var h = Math.floor(t/1000/60/60%24);

var i = Math.floor(t/1000/60%60);

var s = Math.floor(t/1000%60);

document.getElementById('djs').innerHTML = "距離活動結束還有:"+d+"天"+h+"時"+i+"分"+s+"秒";

setTimeout(djstest, 1000);

}

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 一、JS前言 (1)認識JS 也許你已經了解HTML標記(也稱為結構),知道了CSS樣式(也稱為表示),會使用HT...
    凜0_0閱讀 2,798評論 0 8
  • html結構層 (1)指定日期的倒計時 js結構層 //每次刷新都是1分鐘的倒計時,var t=3600000;f...
    痛心涼閱讀 396評論 0 1
  • html結構層 (1)指定日期的倒計時 js結構層 //每次刷新都是1分鐘的倒計時, var t=3600...
    電影里的夢i閱讀 228評論 0 0
  • 第1章 認識JS JavaScript能做什么?1.增強頁面動態效果(如:下拉菜單、圖片輪播、信息滾動等)2.實現...
    mo默22閱讀 1,326評論 0 5
  • 定好時間,十五分鐘,緊張的寫作又開始了,此刻,我的身上微微出汗,打錯了幾個字,手機屏幕暗下來了,可能自己弄成了省電...
    水玲瓏英子閱讀 123評論 0 2