本文目录一览:
- 1、javaWeb中如何做倒计时
- 2、JS 倒计时问题,手机网页后台运行时,js会暂停
- 3、JS倒计时页面代码(要求读取服务器时间)
- 4、web后台这侧登录倒计时js怎么用
javaWeb中如何做倒计时
input type=”button” value=”倒计时” id=”button1″
onClick=”timedMsg()”
script type=”text/javascript”
var c=5;
var t;
function timedMsg()
{
document.getElementById(‘button1’).value=”倒计时”+c;
document.getElementById(‘button1’).disabled=true;
if(c==0){
clearTimeout(t);
window.location.href=”url”;//为跳转地址
}else{
t=setTimeout(‘timedMsg()’,1000);
}
c–;
}
/script
点击按钮开始倒计时,当计时为0的时候跳转
setTimeout设置多少时间调用函数,返回值用于清除定时器
JS 倒计时问题,手机网页后台运行时,js会暂停
如果我答得好请给我一点分
在html5中document新增了一个事件 visibilitychange,这个事件在页面前台或后台切换时被触发,你所说的问题就简单了,它也有个对应的属性visibilityState,用于检测当前页面的状态值为hidden还是visible。
解法是,在hidden时记录当前时间,在visible时用当前时间减去之前记录的时间就为当前倒计时需要减去的时间,这也就不需要和后台沟通了,或者你直接在visible时刷新页面也行,下面是小样,你测试一下
var b=getTime();
function getTime()
{
return Date.now();
}
document.addEventListener(‘webkitvisibilitychange’,function()
{
if(document.webkitVisibilityState==’hidden’)
{
b=getTime();
}else
{
document.body.appendChild(document.createTextNode(‘间隔:’+(getTime()-b)))
}
})
document.addEventListener(‘mozvisibilitychange’,function()
{
if(document.mozVisibilityState==’hidden’)
{
b=getTime();
}else
{
document.body.appendChild(document.createTextNode(‘间隔:’+(getTime()-b)))
}
})
JS倒计时页面代码(要求读取服务器时间)
用JavaScript获取服务器时间,然后做页面倒计时的程序代码如下:
!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “”
html xmlns=”” xml:lang=”en” lang=”en”
head
meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″/
titleuntitled/title
script type=”text/javascript”
get=function (id){
return document.getElementById(id)
}
if(document.all){
window.XMLHttpRequest=function(){
var get=[‘Microsoft.XMLHTTP’,’Msxml2.XMLHTTP’];
for(var i=0;iget.length;i++)
{
try{
return new ActiveXObject(get[i])
}
catch(e){}
};
};
}
webDate=function(fn){
var Htime=new XMLHttpRequest();
Htime.onreadystatechange=function(){
Htime.readyState==4(fn(new Date(Htime.getResponseHeader(‘Date’))))
};
Htime.open(‘HEAD’, ‘/?_=’+(-new Date)); Htime.send(null);
}
window.time=new Date();
targetTime=new Date();
time2String=function (t){
with(t)return [getFullYear(),’年’ ,(‘0’+(getMonth()+1)).slice(-2),’月’ ,(‘0’+getDate()).slice(-2),’日 ‘ ,(‘0’+getHours()).slice(-2),’: ‘ ,(‘0’+getMinutes()).slice(-2),’: ‘ ,(‘0’+getSeconds()).slice(-2)].join(”)
}
int2time=function (m){
m-=(D=parseInt(m/86400000))*86400000; m-=(H=parseInt(m/3600000))*3600000; S=parseInt((m-=(M=parseInt(m/60000))*60000)/1000);
return D+’天’+H+’小时’+M+’分’+S+’秒’
}
setInterval(function (){
webDate(function (webTime){
get(‘web’).innerHTML=time2String(time=webTime);
})
get(‘locale’).innerHTML=time2String(new Date);
get(‘time’).innerHTML=int2time(targetTime-time);
if ((targetTime-time)0) {
get(‘time’).innerHTML = ‘Game Over’;
} },1000)
/script
/head
body
设定时间:2015年06月18日0时0分0秒br 服务器时间:span id=’web’loading…/spanbr
本地时间:span id=”locale”loading…/spanbr
倒计时时间:span id=”time”loading…/span
script type=”text/javascript” charset=”utf-8″ targetTime=new Date(2015,06,18,00,00,00); /script
/body
/html
注:原理用xmlhttp来获取服务器上的时间,后台用js做倒计时显示到页面上,由于获取服务器时间这个在本地运行不一定能成功,最好是在服务器上运行!
web后台这侧登录倒计时js怎么用
var t=60;
var a=setInterval(daojishi,1000);//1000毫秒
function daojishi(){
t–;
//刷新时间显示
if(t==0){
clearInterval(a);
//倒计时结束
}
}
描述:60秒倒计时