近日要做一個東西。里面就要用到無閃爍刷新技術。
本人技術菜,JS不會,ASP會那么一點。所以就找例子去了。
現在將所得到的例子轉貼并把自己學得貼出來,希望對各位有所幫助。
無刷新實現的幾點要點:
1,要設置好獲得數據的url
2,要實現數據的調用
3,要實現數據的無刷新
先看js是怎樣實現的
以下是lesen的利用js的無刷新
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<script language="javascript" type="text/javascript">
<!--關鍵在這個函數-->
function GetData(url)
{
try
{
DataLoad.src = url;
}
catch(e)
{
return false;
}
}
</script>
<script id="DataLoad" language="javascript" type="text/javascript" defer></script>
</head>
<body>
<input type="button" name="Submit" value="請求" onClick="GetData('dataload.aspx')">
</body>
</html>
相信大家也許已經看過這代碼,這個是利用onClick事件實現數據庫更新加載的
但是數據調用和自動刷新還沒有。
所以我對這個作了如下修改
<script language="javascript" type="text/javascript">
function GetData(url)
{
url="login1.asp"
try
{
DataLoad.src = url;
}
catch(e)
{
return false;
}
{
var timeoutid = setTimeout("GetData()",2000)
}
}
</script>
<body>
<script id="DataLoad" language="javascript" type="text/javascript" defer></script>
<script language="javascript" type="text/javascript">
<!--
function MM_callJS(jsStr) { //v2.0
return eval(jsStr)
}
//-->
</script>
<body onLoad="MM_callJS('GetData()')">
<span id=xx></span>
</body>
先解釋:
url="login1.asp" 定義數據url
var timeoutid = setTimeout("GetData()",2000) 定義GetData()這個的刷新時間
<script language="javascript" type="text/javascript">
<!--
function MM_callJS(jsStr) { //v2.0
return eval(jsStr)
}
//-->
</script>
<body onLoad="MM_callJS('GetData()')">
利用 MM_callJS 這個實現網頁下載時加載GetData()
<span id=xx></span> 調用login1.asp里面的xx數據
login1.asp 設置如下
{
xx.innerHTML="<%=("now")%>"
}
這樣通過innerHTML我們就能調用數據了。
此外還有一些實現無刷新的:
如經典里的文件替換無刷新
經典里的JS替換文件實現無刷新。
<head>
<script language="javascript">
var value = "";
var timeid = null;
var ready = false;
function showvalue() {
ready = false;
text.innerHTML = "請稍候……";
if (scr.src == "1.js") scr.src = "2.js";
else scr.src = "1.js";
loadscr();
}
function loadscr() {
if (ready) {
text.innerHTML = value;
}
else {
clearTimeout(timeid);
timeid = setTimeout("loadscr();", 10);
}
}
</script>
</head>
<BODY aLink=#000020 bgColor=#ffffff id=all link=#000020 text=#070155 topMargin=10 vLink=#000020 marginheight="10" marginwidth="10">
<button type="button" onclick="showvalue();">切換</button>
<span id="text"></span>
<script id="scr" language="javascript" src=""></script>
</body>
1.js
value = '這是第1個腳本';
ready = true;
2.js
value = '這是第2個腳本';
ready = true;
只要加個定時間刷新 showvalue() 就會自動刷新了。
還有的就是利用XML
原理和方法大概和js的一樣,只不過XML要求高一點而已
<SCRIPT language=javascript>
<!--
function bar(){
var oXMLDoc = new ActiveXObject('MSXML'); //創建'MSXML'對象
sURL = "login.asp" //獲取登陸狀態數據的地址
oXMLDoc.url = sURL; //load數據
var oRoot=oXMLDoc.root; //獲取返回xml數據的根節點
if(oRoot.children != null)
{
//根據返回的數據在客戶端顯示
xx.innerHTML=oRoot.children.item(0).text; //用戶
yy.innerHTML=oRoot.children.item(1).text; //時間
hp.innerHTML=oRoot.children.item(2).text; //停留
}
var timeoutid = setTimeout("bar()",1500)
} //每1.5秒重獲一次數據,}
//-->
</SCRIPT>
<script language="javascript" type="text/javascript">
<!--
function MM_callJS(jsStr) { //v2.0
return eval(jsStr)
}
//-->
</script>
<body leftmargin="0" onLoad="MM_callJS('bar()')">
yy:<span id=xx></span> xx:<span id=yy></span> hp:<span id=hp></span>
login.asp
<?xml version="1.0" encoding="gb2312" ?>
<plan>
<xx>更改就看到</xx>
<yy>更改就看到</yy>
<hp>1112311</hp>
</plan>
好了,該總結的都完了。希望這篇文章能對大家有所幫助。
timeoutid = setTimeout("GetData()",2000)
這個會比價耗資源的
注明:這個貼子只是我的總結,有錯誤的地方謝謝指出。也歡迎和我交流:23638564
廣告時間:www.54nb.com 是個學習技術好地方。哇哈哈哈。
新聞熱點
疑難解答