為了讓各為能夠了解什么是AJAX，以下是一個(gè)AJAX的手工范例（即不引用任何的Library或AJAX framework），此范例頗為精要易懂，其作用主要是透過Client 端的Browser來即時(shí)監(jiān)控Web 服務(wù)器資源或效能變化，各位只要做過一遍范例就能夠了解AJAX在網(wǎng)頁開發(fā)上是多么具有威力了。
先來看看效果圖：
本范例是一個(gè)簡單的AJAX例子，但麻雀雖小五臟俱全，可由此窺見原始AJAX非同技術(shù)是如何運(yùn)作。不需要安裝任何特殊的AJAX套件，步驟說明如下：
一 建立Web項(xiàng)目
首先在VS 2005（或VS.NET 2003）建立一個(gè)普通的WEB項(xiàng)目，或者您沒有VS開發(fā)工具，直接用記事本建立也行。
二 建立Client端頁面
在Web專案中加入一個(gè)Client端頁面Client.htm，并將此頁面設(shè)定為起始頁，這個(gè)頁面會(huì)向Web伺服器網(wǎng)頁發(fā)出非同步呼叫請(qǐng)求，并且將伺服器回傳資料更新到網(wǎng)頁元素中，代碼如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<script language="javascript">
var XmlHttp=new ActiveXObject("Microsoft.XMLhttp");
function sendAJAX()
{
XmlHttp.Open("POST","Server.aspx",true);
XmlHttp.send(null);
XmlHttp.onreadystatechange=ServerProcess;
}
function ServerProcess()
{
if (XmlHttp.readystate==4 || XmlHttp.readystate=='complete')
{
document.getElementById('nameList').innerHTML
=XmlHttp.responsetext;
}
}
setInterval('sendAJAX()',1000);
</script>
</head>
<body>
<div id="nameList"></div>
</body>
</html>
三 建立Server端處理程式
另外在專案中加入一個(gè)Server.aspx網(wǎng)頁（含.cs），Server.aspx不需要添加任何代碼。
Server.aspx.cs 程序碼如下：
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Diagnostics;
public partial class Server : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
PerformanceCounter myMemory = new PerformanceCounter();
myMemory.CategoryName = "Memory";
myMemory.CounterName = "Available KBytes";
string txtResult = "-->服務(wù)器可以用記憶體大�。�" +
myMemory.NextValue().ToString() + "KB";
Response.Write(DateTime.Now.ToLongTimeString() + txtResult);
}
}
說明：
首先記得引用System.Diagnostics 命名空間，因?yàn)镻erformanceCounter 必須使用該命名空間，
而PerformanceCounter類別可讓您監(jiān)控Windows 作業(yè)系統(tǒng)的各種效能計(jì)數(shù)器，在此透過它取得服務(wù)器每秒可用記憶體大小的變化情形。
執(zhí)行Client.htm頁面,大約會(huì)花5秒啟始Performance-Counter物件，之后透過AJAX便可每秒獲得Server可用記憶
體變化情形。當(dāng)然用Server Side的Timer也可以實(shí)現(xiàn)，但那種方式會(huì)造成Server的Loading爆增，人多的話還可能搞垮你的Server，但AJAX 就具有極佳的彈性與靈巧，透過AJAX您可以即時(shí)偵測到資料庫或事件的變化即時(shí)顯現(xiàn)在網(wǎng)頁上。
|
