程式師世界 >> 編程語言 >> JAVA編程 >> 關於JAVA >> XMLHTTP無刷新自動實時更新數據

XMLHTTP無刷新自動實時更新數據

編輯：關於JAVA

傳統上，我們浏覽網頁,如果加入最新的數據。只能是等我們重新向服務器端請求時才能顯示出來。但是，對於一些時效性很強的網站，傳統的這種做法是不能滿足的。

我們可以讓程序自動刷新，定時向服務器請求數據。5秒取一次數據，10秒取一次數據。利用XMLHTTP發出請求並取得數據。傳到客戶端，客戶端重新組織並顯示數據。 http://www.mscto.com

demo.htm 前台顯示. 軟件開發網

<script language="Javascript">

            function GetResult()

            {

            /**---------------

            GetResult()

            -----------------*

            GetResult() *

            功能:通過XMLHTTP發送請求,返回結果.*

            參數:str,字符串,發送條件.*

            實例:GetResult();*---------------

            GetResult() -----------------*/

            var oBao =

            new ActiveXObject("Microsoft.XMLHTTP");

            //特殊字符： ,%,&,=,?

            等的傳輸解決辦法.字符串先用escape編碼的.

            //Update:2004-6-1 12:22oBao.open

            ("POST","Server.asp",false);oBao.send();

            //服務器端處理返回的是經過escape

            編碼的字符串.var

            strResult = unescape(oBao.responseText);

            //將字符串分開.var arrResult =

            strResult.split("###");RemoveRow();

            //刪除以前的數據.//將取得的字符串分開,

            並寫入表格中.for(var i=0;

            i<arrResult.length;i  )

            {

            arrTmp = arrResult[i].split("@@@");

            num1 = arrTmp[0];

            //字段num1的值num2 = arrTmp[1];

            //字段num2的值row1 = tb.insertRow();

            cell1 = row1.insertCell();

            cell1.innerText = num1;

            cell2 = row1.insertCell();

            cell2.innerText = num2;}

            }function RemoveRow(){

            //保留第一行表頭,其余數據均刪除

            .var iRows = tb.rows.length;

            for(var i=0;i<iRows-1;i  ){tb.deleteRow(1);

            }}function MyShow()

            {

            //2秒自動刷新一次,2秒取得一次數據

            .timer = window.setInterval

            ("GetResult()",2000);}

            </script><body onload="MyShow()"

            ><p></p><table width="47%"

            height="23" border="0"

            cellpadding="1" cellspacing="0"

            id="tb"><tr><td>num1</td>

            <td>num2</td></tr></table>

            Server.ASP 後台讀取數據

            <% @Language="JavaScript" %>

            <%function OpenDB(sdbname)

            {/**--------------- OpenDB

            (sdbname) -----------------*

            OpenDB(sdbname) * 功能:

            打開數據庫sdbname,返回conn對象.

            * 參數:sdbname,字符串,數據庫名稱.

            * 實例:var conn = OpenDB("database.mdb");

            *--------------- OpenDB(sdbname)

            -----------------*/var connstr =

            "Provider=Microsoft.Jet.OLEDB.4.0;

            Data Source=" Server.MapPath(sdbname);

            var conn =

            Server.CreateObject("ADODB.Connection");

            conn.Open(connstr);return conn;

            }

            var sResult = new Array();

            var oConn = OpenDB("data.mdb");

            //特殊字符： ,%,&,=,?等的傳輸解決辦法

            .客戶端字符是經過escape編碼的

            //所以服務器端先要經過unescape解碼.

            //Update:2004-6-1 12:22var sql =

            "select num1,num2 from nums order by id";

            var rs = oConn.Execute(sql);while(!rs.EOF)

            {

            //一條記錄用"###"隔開.每列數據用"@@@"隔開. 這是以只有兩個列數據的情況.sResult[sResult.length]

            = rs("num1").Value   "@@@"  

            rs("num2").Valuers.MoveNext();}

            //escape解決了XMLHTTP。

            中文處理的問題.Response.Write(escape

            (sResult.join("###")));%>

數據庫data.mdb 
表 nums 軟件開發網
id,自動編號 
num1,文本 
num2,文本 
http://www.mscto.com
測試數據 
http://www.mscto.com
id num1 num2 軟件開發網
1 20.70 20.810 
http://www.mscto.com
2 10.5 20.5 
3 12.3 300 
4 132 323 
5 563 56 
6 20 10