JS显示动态的日期时间,参考如下:
<body><span id="localtime">2013-10-30 12:33:02 星期三</span>
<script type="text/javascript">
function showLocale(objD)
{
var str,colorhead,colorfoot
var yy = objD.getYear()
if(yy<1900) yy = yy+1900
var MM = objD.getMonth()+1
if(MM<10) MM = '0' + MM
var dd = objD.getDate()
if(dd<10) dd = '0' + dd
var hh = objD.getHours()
if(hh<10) hh = '0' + hh
var mm = objD.getMinutes()
if(mm<10) mm = '0' + mm
var ss = objD.getSeconds()
if(ss<10) ss = '0' + ss
var ww = objD.getDay()
if ( ww==0 ) colorhead="<font color=\"red\">"
if ( ww > 0 && ww < 6 ) colorhead="<font color=\"red\">"
if ( ww==6 ) colorhead="<font color=\"red\">"
if (ww==0) ww="星期日"
if (ww==1) ww="星期一"
if (ww==2) ww="星期二"
if (ww==3) ww="星期三"
if (ww==4) ww="星期四"
if (ww==5) ww="星期五"
if (ww==6) ww="星期六"
colorfoot="</font>"
str = colorhead + yy + "-" + MM + "-" + dd + " " + hh + ":" + mm + ":" + ss + " " + ww + colorfoot
return(str)
}
function tick()
{
var today
today = new Date()
document.getElementById("localtime").innerHTML = showLocale(today)
window.setTimeout("tick()", 1000)
}
tick()
</script>
</body>
<!DOCTYPE HTML><html>
<head>
<meta charset=UTF-8>
<title>Nothing</title>
<style type="text/css">
div.outer {
margin: auto
width: 30%
}
input[type=text].txt {
border: 5px solid blue
font-weight: bolder
}
.line {
display: inline
}
.time {
font: 20px Consolas, 微软雅黑
color: red
}
div.x {
font: 20px Consolas, 微软雅黑
}
div.x {
font: 20px Consolas, 微软雅黑
cursor: pointer
}
div.x:hover {
color: cyan
}
div.high {
margin: -34px 0px 0px 275px
}
div.low {
margin: -5px 0px 0px 275px
}
</style>
<script type="text/javascript">
onload = function ()
{
var txt = document.querySelector (".txt")
var high = document.querySelector (".high")
var low = document.querySelector (".low")
var funny = function (isHigh)
{
if (txt.value === "")
{
txt.value = "09:00"
}
else
{
var hour = parseFloat (txt.value.split (":")[0])
if (isHigh)
{
hour++
hour = hour > 23 ? 0 : hour
}
else
{
hour--
hour = hour < 0 ? 23 : hour
}
hour = /^\d$/.test (hour) ? "0" + hour : hour
txt.value = hour + ":00"
}
}
high.onclick = function ()
{
funny (1)
}
low.onclick = function ()
{
funny ()
}
}
document.onselectstart = function ()
{
return false
}
</script>
</head>
<body>
<div class="outer">
<div class="line time">送货时间:</div>
<div class="line wrap">
<input class="txt" type="text" readonly="readonly" />
<div class="x high">+</div>
<div class="x low">-</div>
</div>
</div>
</body>
</html>
var the_s = 188888//定义剩余时间, 必须用时间戳.单位为秒setInterval(promote,1000)//每秒执行一次下面的函数
function promote() {
var d = Math.floor((the_s / 3600) / 24)
var g = Math.floor((the_s - d * 24 * 3600) / 3600)
var e = Math.floor((the_s - d * 24 * 3600 - g * 3600) / 60)
var f = (the_s - g * 3600) % 60
var html = "还剩<b>" + d + "</b>天<b>" + g + "</b>时<b>" + e + "</b>分<b>" + f + "</b>秒"
document.getElementById("divdown1").innerHTML = html//这个id是你想要显示的div的id
the_s--
}
我这个定时器比你的好, 用我的. 你只要定义了the_s和要显示在哪的id. 就可以用了.
如你要显示剩余4小时, 那么将4小时转化为秒: 4*60*60=14400, 就这样调用:
var the_s = 14400setInterval(promote,1000)
就ok了. 记得要引用我的函数哟~