1、AJAX简介
（1、没有AJAX会怎么样？普通的ASP.Net每次执行服务端方法的时候都要刷新当前页面，比如实现显示服务器的时间。每次都要刷新页面的坏处：页面刷新打断用户操作、速度慢、增加服务器的流量压力。 如果没有AJAX，在youku看视频的过程中如果点击了“顶、踩”、评论、评论翻页，页面就会刷新，视频就会被打断。试想一个效果：在YOUKU网看视 频，然后看到一个顶踩的功能，看没有ajax会打断视频，然后将按钮用UpdatePanel包起来就不会打断视频了。用HttpWatch看没有 AJAX的时候服务器返回的是整个页面，有了AJAX服务器只返回几个按钮的内容。
（2、AJAX（AsynchronousJavaScript and XML，异步JavaScript和XML）是一种进行页面局部异步刷新的技术。用AJAX向服务器发送请求和获得服务器返回的数据并且更新到界面中，不是整个页面刷新，而是在HTML页面中使用JavaScript创建XMLHTTPRequest对象来向服务器发出请求以及获得返回的数据，就像JavaScript版的WebClient一样，在页面中由XMLHTTPRequest来发出Http请求和获得服务器的返回数据，这样页面就不会刷新了。XMLHTTPRequest是AJAX的核心对象。
2、 XMLHTTPRequest
![]()
（1、开发一个AJAX功能需要开发服务端和客户端两
块程序。以一个显示服务端时间为例。首先开发一个GetDate1.ashx，输出当前时间。在HTML页面中放一个按
钮，在按钮的onclick中创建XMLHTTP向GetDate1.ashx发送请求，获得返回的数据并且显示到界面上。下面的代码非常重要，是精华来
着，必背：
![]()
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <title>AJAX01</title>
5 <script type="text/javascript">
6 function btnClick() {
7 //alert(1);
8 // 1 创建XMLHTTP对象，相当于WebClient
9 var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
10
11 if (!xmlhttp) {
12 alert("创建xmlhttp对象异常");
13 return;
14 }
15
16 // 2 “准备”01AJAX.ashx发出Post请求。这里还没有发出请求
17 //XMLHTTP默认（也推荐）不是同步请求的，也就是open方法并不像WebClient的DownloadString
18 //那样把服务器返回的数据拿到才返回，
19 //是异步的，因此需要监听onreadystatechange事件
20
21
22 xmlhttp.open("POST", "01AJAX.ashx?id=" + encodeURI('AJAX服务器') + "&ts=" + new Date(), false);
23
24 xmlhttp.onreadystatechange = function () {
25 if (xmlhttp.readyState == 4) {//readyState == 4 表示服务器返回数据了
26 if (xmlhttp.status == 200) {//如果状态码为200则是成功
27 //接收服务器的返回数据，没有用send的返回值，而是在onreadystatechange事件里来接收
28 document.getElementById("txtTime").value = xmlhttp.responseText; //responseText属性为服务器返回的文本
29 }
30 else {
31 alert("AJAX服务器返回错误!");
32 }
33 }
34 }
35 //不要以为if(xmlhttp.readyState == 4) 在send之前执行！！！！
36 //if (xmlhttp.readyState == 4)只有在服务器返回值以后才会执行，而!!send之后过一会儿服务器才会返回数据
37 xmlhttp.send(); //这时才开始发送请求
38 }
39 </script>
40 </head>
41 <body>
42 <input type="text" id="txtTime" />
43 <input type="button" id="btn" value="button" onclick="btnClick()" />
44 </body>
45 </html>
1 using System;
2 using System.Collections.Generic;
3 using System.Linq;
4 using System.Web;
5
6 namespace AJAX
7 {
8 /// <summary>
9 /// _01AJAx 的摘要说明
10 /// </summary>
11 public class _01AJAx : IHttpHandler
12 {
13
14 public void ProcessRequest(HttpContext context)
15 {
16 context.Response.ContentType = "text/plain";
17 string id = context.Request["id"];
18 context.Response.Write(DateTime.Now.ToString()+"---"+id);
19 }
20
21 public bool IsReusable
22 {
23 get
24 {
25 return false;
26 }
27 }
28 }
29 }