網(wǎng)頁(yè)定時(shí)刷新

Ethan的博客 2011-03-21

展開全文

在Web開發(fā)中我們經(jīng)常需要實(shí)現(xiàn)定時(shí)刷新某個(gè)頁(yè)面：1.來(lái)保持session的值或者檢查session的值是否為空(比如說(shuō)防止同一用戶重復(fù)登錄)；2.實(shí)現(xiàn)實(shí)時(shí)站內(nèi)短信；3.定時(shí)更新頁(yè)面數(shù)據(jù)等等。但是我們?cè)诰W(wǎng)上搜搜會(huì)發(fā)現(xiàn)有很多定時(shí)刷新頁(yè)面的方法，最簡(jiǎn)單的就是在<head></head>標(biāo)記之間加上如下代碼：

在<head></head>標(biāo)記之間加上代碼，實(shí)現(xiàn)定時(shí)刷新，此代碼我已經(jīng)測(cè)試過(guò)，可以實(shí)現(xiàn)效果

說(shuō)明：content的值代表頁(yè)面刷新的間隔時(shí)間，以秒為單位

URL的值指定刷新的頁(yè)面

還有一種方法就是用JavaScript來(lái)定時(shí)刷新頁(yè)面

JavaScript定時(shí)刷新頁(yè)面，此代碼我沒有經(jīng)過(guò)測(cè)試

1 <script>
2 var limit="0:10"
3 if (document.images){
4 var parselimit=limit.split(":");
5 parselimit=parselimit[0]*60+parselimit[1]*1;
6 }
7 function beginrefresh(){
8 if (!document.images)
9 return;
10 if (parselimit==1)
11 window.location.reload();
12 else{
13 parselimit-=1;
14 curmin=Math.floor(parselimit/60);
15 cursec=parselimit%60;
16 if (curmin!=0)
17 curtime=curmin+" min "+cursec+" sec ";
18 else
19 curtime=cursec+" sec ";
20 window.status=curtime;
21 setTimeout("beginrefresh()",1000);
22 }
23 }
24 window.onload=beginrefresh;

25 </script>

加到body中間，這里是0:10為10秒鐘，可以自定義

當(dāng)然還有很多中方法，我這里就不一一列舉了。用以上方法刷新頁(yè)面有點(diǎn)缺點(diǎn)就是刷新頁(yè)面的時(shí)候會(huì)閃爍，那樣的話如果需要在短時(shí)間內(nèi)就刷新的話估計(jì)用戶的眼都閃壞了，而且也顯得我們太不專業(yè)了吧。，呵呵，開個(gè)玩笑。如果有一種方法能夠定時(shí)刷新指定的頁(yè)面，而且不會(huì)讓我們看見頁(yè)面閃爍，那么該多好啊，是吧？無(wú)閃爍的頁(yè)面刷新我們一般采用ajax+js或者webservice來(lái)實(shí)現(xiàn)，下面我就介紹一種用ajax+js來(lái)實(shí)現(xiàn)無(wú)閃爍定時(shí)刷新的方法，其實(shí)我對(duì)ajax了解的也很淺，在做項(xiàng)目的過(guò)程我們用ajax來(lái)實(shí)現(xiàn)局部刷新。好了，廢話不多說(shuō)了，看看代碼：=>

ajax+js實(shí)現(xiàn)無(wú)閃爍定時(shí)刷新頁(yè)面

function makeRequest() {

var guid = rnd();

//記住給個(gè)隨機(jī)數(shù)，不然的話有緩存

var url = "example_b.aspx?id=" + guid;

createXMLHttpRequest();

xmlHttp.onreadystatechange = handleRefresh;

xmlHttp.open("GET", url, false);

xmlHttp.send(null);

}

//創(chuàng)建xmlHttp

var xmlHttp;

function createXMLHttpRequest() {

if (window.ActiveXObject) {

xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");

}

else if (window.XMLHttpRequest) {

xmlHttp = new XMLHttpRequest();

}

//返回信息

function handleRefresh() {

if (xmlHttp.readyState == 4) {

if (xmlHttp.status == 200) {

if (xmlHttp.responseText == "sessionNull") {

//alert('登錄超時(shí)，帳戶注銷，請(qǐng)重新登錄...');

window.parent.document.location = "UserLogin.aspx";

}

setTimeout("makeRequest()", 8*000);

}

//創(chuàng)建隨機(jī)數(shù)

rnd.today = new Date();

rnd.seed = rnd.today.getTime();

function rnd() {

rnd.seed = (rnd.seed * 9301 + 49297) % 233280;

return rnd.seed / (233280.0);

}

function rand(number) {

return Math.ceil(rnd() * number);

}

</script>

舉個(gè)例子，比如說(shuō)要example_a.aspx頁(yè)面加載以后讓測(cè)試頁(yè)面example_b.aspx每8秒刷新一次，檢查存放登錄用戶名的session值是否為空，如果session為空，則返回登錄頁(yè)面。那么我們可以將上面的js代碼放在example_a.aspx頁(yè)面的<head></head>標(biāo)記之間，然后在頁(yè)面body的onload事件中調(diào)用上面的方法：onload="makeRequest()",然后在頁(yè)面的Page_Load事件中判斷：

if (Session["user"] == null)Code

{

Response.Clear();

Response.Write("sessionNull");

Response.End();

}

本站是提供個(gè)人知識(shí)管理的網(wǎng)絡(luò)存儲(chǔ)空間，所有內(nèi)容均由用戶發(fā)布，不代表本站觀點(diǎn)。請(qǐng)注意甄別內(nèi)容中的聯(lián)系方式、誘導(dǎo)購(gòu)買等信息，謹(jǐn)防詐騙。如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容，請(qǐng)點(diǎn)擊一鍵舉報(bào)。

轉(zhuǎn)藏 分享

QQ空間 QQ好友新浪微博微信

獻(xiàn)花（0） +1

來(lái)自： Ethan的博客 > 《云圖書館》

舉報(bào)/認(rèn)領(lǐng)