AJAX技術(shù) vs 傳統(tǒng)的ASP無(wú)刷新技術(shù)

2010-08-28 10:48:52來(lái)源:西部e網(wǎng)作者:

  ajax技術(shù)的優(yōu)勢(shì)到底在哪里呢,不明白?匆粋(gè)最簡(jiǎn)單的例子,假設(shè)用戶注冊(cè)的時(shí)候,判斷用戶輸入的名字是否已經(jīng)被占用,假設(shè)輸入數(shù)字1:顯示"OK"(表示正確,可以使用);輸入其他字符:顯示"Error" (表示錯(cuò)誤,已經(jīng)被占用)。

  用ajax技術(shù)實(shí)現(xiàn)

  代碼: t.htm

<script>
function f(){
var req =new ActiveXObject("Microsoft.XMLHTTP");
req.open("GET","t.asp?t1="+t1.value, true);
req.onreadystatechange = function(){
  if (req.readyState == 4) {
  if (req.status == 200) {
   msg.innerText = req.responseXML.documentElement.tagName;
}
}
}
req.send(null);
}
</script>
<div>1:顯示"OK"; 其他字符:顯示"Error"</div>
<input id=t1 value=1>
<input type=button value="檢測(cè)" onclick="javascript:f()">
<div id=msg></div>

  代碼:

t.asp
<%
Response.ContentType="text/xml"
if request.querystring("t1")="1" then
response.write("<OK/>")
else
response.write("<ERROR/>")
end if
%>

  傳統(tǒng)的asp無(wú)刷新技術(shù)

  代碼t.htm

<script>
function f(){
document.getElementById("o").src="t.asp?t1="+t1.value
}
</script>
<div>1:顯示"OK"; 其他字符:顯示"Error"</div>
<input id=t1 name=1 value=1>
<input type=button value="檢測(cè)" onclick="javascript:f()">
<div id=msg></div>
<iframe src="t.asp" style="display:none" id=o></iframe>

  代碼t.asp

<%
if request.querystring="" then response.end
ss="ERROR"
if request.querystring("t1")="1" then ss="OK"
%>
<script>parent.msg.innerText="<%=ss%>"</script>

  兩者都是無(wú)刷新提取服務(wù)器(數(shù)據(jù)庫(kù))數(shù)據(jù)并實(shí)時(shí)顯示在客戶段,那為什么現(xiàn)在都要用 ajax呢,還要考慮中文編碼等麻煩問(wèn)題。ajax到底好在哪里,請(qǐng)高手詳細(xì)說(shuō)說(shuō),我可是一知半解,還沒(méi)有領(lǐng)會(huì)到 ajax的妙處。

  在這里,我們暫時(shí)只討論 ajax 調(diào)用同域下的asp文件(也就是說(shuō)自己寫(xiě)的asp程序),小偷程序,偷取新聞,天氣預(yù)報(bào)等應(yīng)用技術(shù)暫時(shí)不討論,例子寫(xiě)得很簡(jiǎn),沒(méi)有進(jìn)行錯(cuò)誤處理等,僅為討論之用。
關(guān)鍵詞:AJAX

贊助商鏈接: