<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>index</title> <script src="jquery.min.js"></script> <style> div.box{ width:1200px; padding:20px; margin:20px; border:1px solid #c00; border-radius: 5px } div.box>span{ color:#999; text-align: center; font-size: 2em; } div.content{ width:1160px; margin:10px 0; padding:20px; border:2px solid #666; text-align: center; } input[type='text']{ width:45px; height:35px; padding:5px 10px;margin:5px 0; border:1px solid #c00; text-align: center; border-radius: 5px; } </style> </head> <body> <div class="box"> <span>距离2018年元旦还剩：</span><br> <div class="content"> <input type="text" id="time_d">天<input type="text" id="time_h">时<input type="text" id="time_m">分<input type="text" id="time_s">秒 </div> </div> <script> function show_time(){ var time_start = new Date().getTime(); //设定当前时间 var time_end = new Date("2018/01/01 00:00:00").getTime(); //设定目标时间 // 计算时间差 (毫秒) var time_distance = time_end - time_start; // 天 var int_day = Math.floor(time_distance/86400000) time_distance -= int_day * 86400000; // 时 var int_hour = Math.floor(time_distance/3600000) time_distance -= int_hour * 3600000; // 分 var int_minute = Math.floor(time_distance/60000) time_distance -= int_minute * 60000; // 秒 var int_second = Math.floor(time_distance/1000) // 时分秒为单数时、前面加零 if(int_day < 10){ int_day = "0" + int_day; } if(int_hour < 10){ int_hour = "0" + int_hour; } if(int_minute < 10){ int_minute = "0" + int_minute; } if(int_second < 10){ int_second = "0" + int_second; } // 显示时间 $("#time_d").val(int_day); $("#time_h").val(int_hour); $("#time_m").val(int_minute); $("#time_s").val(int_second); } setInterval("show_time()",1000); </script> </body> </html>