为了简单明了，我只在html中测试；注释里写的很清楚，我就不多废话了；
很多家公司在面试的时候可能会让你不使用任何Ajax的框架实现Ajax效果，虽然这段代码看上去挺痛苦，但也没有别的办法，记不记也得记(其实理解起来就没那么难记了……)
readyState表示XMLHttpRequest对象的处理状态： 0:XMLHttpRequest对象还没有完成初始化。 1:XMLHttpRequest对象开始发送请求。 2:XMLHttpRequest对象的请求发送完成。 3:XMLHttpRequest对象开始读取服务器的响应。 4:XMLHttpRequest对象读取服务器响应结束。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>不使用Ajax框架实现Ajax效果 </title>
<script type="text/javascript" language="javascript">
function btnClick() {
var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); //创建XMLHTTP对象，相当于WebClient
if (!xmlhttp) {
alert("创建xmlhttp对象异常!");
return false;
}
xmlhttp.open("POST", "GetDate.ashx", false); //准备向服务器的GetDate.ashx（一般处理程序）发出POST请求。
//XMLHTTP默认（也推荐）不是同步请求的，也就是open方法并不像WebClient的DownloadString那样把服务器返回的数据拿到才返回，是异步的，因此需要用匿名监听onreadystatechange事件；
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4) { //如果XMLHTTPRequest对象读取服务器响应结束；
if (xmlhttp.status == 200) { //如果状态码为200则表示处理成功；
document.getElementById("GetDate").value = xmlhttp.responseText; //responseText属性为服务器返回的文本
} else {
alert("AJAX服务器返回错误");
}
}
}
xmlhttp.send(); //这时才开始发送请求
}
</script>
</head>
<body>
<input id="GetDate" type="text" />
<input type="button" value="请求时间" onclick="btnClick()" />
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>不使用Ajax框架实现Ajax效果 </title>
<script type="text/javascript" language="javascript">
function btnClick() {
var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); //创建XMLHTTP对象，相当于WebClient
if (!xmlhttp) {
alert("创建xmlhttp对象异常!");
return false;
}
xmlhttp.open("POST", "GetDate.ashx", false); //准备向服务器的GetDate.ashx（一般处理程序）发出POST请求。
//XMLHTTP默认（也推荐）不是同步请求的，也就是open方法并不像WebClient的DownloadString那样把服务器返回的数据拿到才返回，是异步的，因此需要用匿名监听onreadystatechange事件；
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4) { //如果XMLHTTPRequest对象读取服务器响应结束；
if (xmlhttp.status == 200) { //如果状态码为200则表示处理成功；
document.getElementById("GetDate").value = xmlhttp.responseText; //responseText属性为服务器返回的文本
} else {
alert("AJAX服务器返回错误");
}
}
}
xmlhttp.send(); //这时才开始发送请求
}
</script>
</head>
<body>
<input id="GetDate" type="text" />
<input type="button" value="请求时间" onclick="btnClick()" />
</body>
</html>
GetDate.ashx (一般处理程序)代码:
using System;
using System.Web;
namespace AJAX
{
/// <summary>
/// GetDate 获取服务器的时间
/// </summary>
public class GetDate : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
context.Response.Write(DateTime.Now.ToString());
}
public bool IsReusable
{
get
{
return false;
}
}
}
}
using System.Web;
namespace AJAX
{
/// <summary>
/// GetDate 获取服务器的时间
/// </summary>
public class GetDate : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
context.Response.Write(DateTime.Now.ToString());
}
public bool IsReusable
{
get
{
return false;
}
}
}
}