AJAX簡單非同步通訊執行個體分析

AJAX簡單非同步通訊執行個體分析_AJAX相關

最後更新：2017-01-18 來源：互聯網

上載者：User

創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

本文執行個體講述了AJAX簡單非同步通訊的方法。分享給大家供大家參考。具體分析如下：

用戶端：向伺服器發出一個空請求。

代碼如下：

<html><head><title>XMLHttpRequest</title><script language="javascript">var xmlHttp;function createXMLHttpRequest(){  if(window.ActiveXObject)    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");  else if(window.XMLHttpRequest)    xmlHttp = new XMLHttpRequest();}function startRequest(){  createXMLHttpRequest();  xmlHttp.open("GET","9-1.aspx",true);  xmlHttp.onreadystatechange = function(){    if(xmlHttp.readyState == 4 && xmlHttp.status == 200)      alert("伺服器返回: " + xmlHttp.responseText);  }  xmlHttp.send(null);}</script></head><body><input type="button" value="測試非同步通訊" onClick="startRequest()"></body></html>

伺服器端：向用戶端直接返回一個字串。

代碼如下：

複製代碼代碼如下:

<%@ Page Language="C#" ContentType="text/html" ResponseEncoding="gb2312" %>
<%@ Import Namespace="System.Data" %>
<%
Response.Write("非同步測試成功，很高興");
%>

問題一：

由於IE 瀏覽器會自動緩衝非同步通訊的結果，不會即時補救伺服器的返回結果。（但Firefox 會正常重新整理）

為瞭解決非同步串連伺服器時IE 的緩衝問題，更改用戶端代碼如下：

var sUrl = "9-1.aspx?" + new Date().getTime(); //地址不斷的變化xmlHttp.open("GET",sUrl,true);

在訪問的伺服器位址末尾添加一個目前時間的毫秒數參數，使得每次請求的URL地址不一樣，從而欺騙IE 瀏覽器來解決IE 緩衝導致的更新問題。

問題二：

當測試程式時，如果用戶端和伺服器端都在同一台電腦上時，非同步對象返回當前請求的http狀態代碼 status == 0 ，於是再次更改用戶端代碼如下：

//if(xmlHttp.readyState == 4 && xmlHttp.status == 200)if( xmlhttp.readyState == 4){   if( xmlhttp.status == 200 || //status==200 表示成功！     xmlhttp.status == 0 ) //本機測試時，status可能為0。      alert("伺服器返回: " + xmlHttp.responseText);}

於是，最終的用戶端代碼如下：

<html><head><title>XMLHttpRequest</title><script language="javascript">var xmlHttp;function createXMLHttpRequest(){  if(window.ActiveXObject)    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");  else if(window.XMLHttpRequest)    xmlHttp = new XMLHttpRequest();}function startRequest(){  createXMLHttpRequest();  var sUrl = "9-1.aspx?" + new Date().getTime(); //地址不斷的變化  xmlHttp.open("GET",sUrl,true);  xmlHttp.onreadystatechange = function(){    //if(xmlHttp.readyState == 4 && xmlHttp.status == 200)    if( xmlhttp.readyState == 4)    {     if( xmlhttp.status == 200 || //status==200 表示成功！       xmlhttp.status == 0) //本機測試時，status可能為0。      alert("伺服器返回: " + xmlHttp.responseText);     }  }  xmlHttp.send(null);}</script></head><body><input type="button" value="測試非同步通訊" onClick="startRequest()"></body></html>

希望本文所述對大家的Ajax程式設計有所協助。

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

Sales Support

1 on 1 presale consultation

Chat Contact Sales
After-Sales Support

24/7 Technical Support 6 Free Tickets per Quarter Faster Response

Open a Ticket
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

Learn More