1 <script type=
"
text/javascript
">
2 var xmlhttprequest;
3 function GetXmlHttpRequest() {
4 if (window.ActiveXObject) {
5 try
6 {
7 // 適用於IE5 IE6
8 xmlhttprequest= new ActiveXObject( " Microsoft.XMLHTTP ");
9 }
10 catch(e)
11 {
12 // 適用於IE7 以上版本
13 xmlhttprequest= new ActiveXObject( " Msxml2.XMLHTTP ");
14 }
15 }
16 if(window.XMLHttpRequest)
17 {
18 // 適用於所有的瀏覽器
19 xmlhttprequest= new XMLHttpRequest();
20 }
21 else
22 {
23 alert( " 對不起，您的瀏覽器不適用於AJAX ");
24 }
25 }
26
27 //執行操作
28 function Operate() {
29 {
30
31 // 先獲取xmlhttprequest
32 GetXmlHttpRequest();
33
34 // POST傳值
35
36 // open方法（指定數據發送方式，處理頁面，是否異步）創建一個新的http請求，並指定此請求的方法、URL以及驗證等信息
37 xmlhttprequest.open( " POST ", " DoOperate.ashx ", true);
38
39 // setRequestHeader(header, value)方法單獨設定某個請求的HTTP頭信息
40 xmlhttprequest.setRequestHeader( " Content-Type ", " application/x-www-form-urlencoded ");
41
42 // 狀態發生事件（onreadyStateChange事件是在readyState屬性發生改變時觸發）
43 xmlhttprequest.onreadystatechange=WatchChange;
44
45 // 發送數據
46 xmlhttprequest.send( " id=1001&name=holyknihgt ");
47
48 // GET傳值 【如果是POST傳值需要設定RequestHeader，而Get傳值不需要】
49 // xmlhttprequest.open("Get", "DoOperate.ashx",true);
50
51 // xmlhttprequest.send(null);
52 }
53
54 // 狀態監聽
55 function WatchChange()
56 {
57 // readyState
58 // 0:send方法還沒有被調用
59 // 1:已經調用了send方法，請求還在處理
60 // 2:send方法已完成 整個應答已接收
61 // 3:正在解析應答
62 // 4:應答解析完成
63
64 // status
65 // 200:表示交互成功
66 // 404：NOT Found
67 // 500：服務器內部錯誤
68 if(xmlhttprequest.readyState== 4 && xmlhttprequest.status== 200)
69 {
70 // 或許響應值
71 var result = xmlhttprequest.responseText;
72 // 將響應值以‘，’分割
73 result = result.split( ' , ');
74 // 給id為resultMsg的控件賦值
75 document.getElementById( " resultMsg ").innerHTML = " ID: "+result[ 0]+ " Name: "+result[ 1];
76 }
77 }
78 </script>
79 </head>
80 <body>
81 <form id= " form1 " runat= " server ">
82 <div>
83 <div id= " resultMsg "></div>
84 <input type= " button " value= " 調用AJAX " onclick= " Operate(); " />
85 </div>
86 </form>
87 </body>
88 </html>
2 var xmlhttprequest;
3 function GetXmlHttpRequest() {
4 if (window.ActiveXObject) {
5 try
6 {
7 // 適用於IE5 IE6
8 xmlhttprequest= new ActiveXObject( " Microsoft.XMLHTTP ");
9 }
10 catch(e)
11 {
12 // 適用於IE7 以上版本
13 xmlhttprequest= new ActiveXObject( " Msxml2.XMLHTTP ");
14 }
15 }
16 if(window.XMLHttpRequest)
17 {
18 // 適用於所有的瀏覽器
19 xmlhttprequest= new XMLHttpRequest();
20 }
21 else
22 {
23 alert( " 對不起，您的瀏覽器不適用於AJAX ");
24 }
25 }
26
27 //執行操作
28 function Operate() {
29 {
30
31 // 先獲取xmlhttprequest
32 GetXmlHttpRequest();
33
34 // POST傳值
35
36 // open方法（指定數據發送方式，處理頁面，是否異步）創建一個新的http請求，並指定此請求的方法、URL以及驗證等信息
37 xmlhttprequest.open( " POST ", " DoOperate.ashx ", true);
38
39 // setRequestHeader(header, value)方法單獨設定某個請求的HTTP頭信息
40 xmlhttprequest.setRequestHeader( " Content-Type ", " application/x-www-form-urlencoded ");
41
42 // 狀態發生事件（onreadyStateChange事件是在readyState屬性發生改變時觸發）
43 xmlhttprequest.onreadystatechange=WatchChange;
44
45 // 發送數據
46 xmlhttprequest.send( " id=1001&name=holyknihgt ");
47
48 // GET傳值 【如果是POST傳值需要設定RequestHeader，而Get傳值不需要】
49 // xmlhttprequest.open("Get", "DoOperate.ashx",true);
50
51 // xmlhttprequest.send(null);
52 }
53
54 // 狀態監聽
55 function WatchChange()
56 {
57 // readyState
58 // 0:send方法還沒有被調用
59 // 1:已經調用了send方法，請求還在處理
60 // 2:send方法已完成 整個應答已接收
61 // 3:正在解析應答
62 // 4:應答解析完成
63
64 // status
65 // 200:表示交互成功
66 // 404：NOT Found
67 // 500：服務器內部錯誤
68 if(xmlhttprequest.readyState== 4 && xmlhttprequest.status== 200)
69 {
70 // 或許響應值
71 var result = xmlhttprequest.responseText;
72 // 將響應值以‘，’分割
73 result = result.split( ' , ');
74 // 給id為resultMsg的控件賦值
75 document.getElementById( " resultMsg ").innerHTML = " ID: "+result[ 0]+ " Name: "+result[ 1];
76 }
77 }
78 </script>
79 </head>
80 <body>
81 <form id= " form1 " runat= " server ">
82 <div>
83 <div id= " resultMsg "></div>
84 <input type= " button " value= " 調用AJAX " onclick= " Operate(); " />
85 </div>
86 </form>
87 </body>
88 </html>