JS如何实现倒计时功能,如何防止刷新。

JavaScript06

JS如何实现倒计时功能,如何防止刷新。,第1张

倒计时可以用js的setTimeout来控制

http://www.tocus.com.cn/?send=article_show&id=34&class=2

可以循环计时,而对于页面刷新,我们可以屏蔽鼠标右键、Ctrl+N、Shift+F10、Alt+F4、F11、F5刷新、退格键来达到效果

<script>

//屏蔽鼠标右键、Ctrl+N、Shift+F10、F11、F5刷新、退格键

function document.oncontextmenu(){event.returnValue=false}//屏蔽鼠标右键

function window.onhelp(){return false} //屏蔽F1帮助

function document.onkeydown(){

if((window.event.altKey)&&((window.event.keyCode==37)||(window.event.keyCode==39))){

//屏蔽Alt+方向键←

//屏蔽Alt+方向键→

event.returnValue=false

}

if((event.keyCode==8)||(event.keyCode==116)||(event.ctrlKey &&event.keyCode==82)){

//屏蔽退格删除键

//屏蔽F5刷新键

//Ctrl+R

event.keyCode=0

event.returnValue=false

}

if(event.keyCode==122){event.keyCode=0event.returnValue=false}//屏蔽F11

if(event.ctrlKey &&event.keyCode==78)event.returnValue=false //屏蔽Ctrl+n

if(event.shiftKey &&event.keyCode==121)event.returnValue=false //屏蔽shift+F10

if(window.event.srcElement.tagName=="A" &&window.event.shiftKey)

window.event.returnValue=false //屏蔽shift加鼠标左键新开一网页

if((window.event.altKey)&&(window.event.keyCode==115)){ //屏蔽Alt+F4

window.showModelessDialog("about:blank","","dialogWidth:1pxdialogheight:1px")

return false

}

}

</script>

<span id="span_dt_dt"></span>

<script language=javascript>

var daytemp=3//新增加变量

function show_date_time(){

window.setTimeout("show_date_time()", 1000)

BirthDay=new Date("02/26/2012")//改成你的计时日期

today=new Date()

timeold=(BirthDay.getTime()-today.getTime())

sectimeold=timeold/1000

secondsold=Math.floor(sectimeold)

msPerDay=24*60*60*1000

e_daysold=timeold/msPerDay

daysold=Math.floor(e_daysold)

e_hrsold=(e_daysold-daysold)*24

hrsold=Math.floor(e_hrsold)

if (hrsold <10){

hrsold = "0"+hrsold

}

e_minsold=(e_hrsold-hrsold)*60

minsold=Math.floor((e_hrsold-hrsold)*60)

if (minsold <10){

minsold = "0"+minsold

}

seconds=Math.floor((e_minsold-minsold)*60)

if (seconds <10){

seconds = "0"+seconds

}

//以下为增加代码:希望你测试通过,然后给分

if(daysold>=0)

{

document.getElementById("span_dt_dt").innerHTML=daysold+"<b>D</b>"+hrsold+"<b>H</b>"+minsold+"<b>M</b>"+seconds+"<b>S</b>"

}

else

{

if(daysold+daytemp>=0)

{

document.getElementById("span_dt_dt").innerHTML=(daysold+daytemp)+"<b>D</b>"+hrsold+"<b>H</b>"+minsold+"<b>M</b>"+seconds+"<b>S</b>"

}

else

{

daytemp=daytemp+3

}

}

}

show_date_time()

</script>

<html>

<head>

<title>JS时间循环</title>

<script type="text/javascript">

window.onload = function(){

showTime(1)

}

var seconds = 5

function showTime(time)

{

document.getElementById("time_div").innerHTML = seconds

if(seconds >= 0)

{

seconds--

}

else{

seconds = 5

window.location.reload()

}

setTimeout("showTime()",1000)

}

</script>

</head>

<body>

<div id="time_div"></div>

</body>

</html>