也是从《AJAX技术入门》的视频上摘录的代码，觉得蛮有用滴，记下来了，以后要用到AJAX的直接在自己的博客上找就得了，省了GOOGLE的时间，嘿嘿！ 效果图如下：只是实现一个简单的用户名验证！ 程序使用ASP.NET实现！ Default.aspx页面源码：
Html代码:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!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五步使用法及中文乱码处理</title> <script type="text/javascript"> var xmlhttp;
function submit() { // 1.创建XMLHttpRequest对象 if (window.XMLHttpRequest) { // IE7,IE8,FireFox,Mozilla,Safari,Opera xmlhttp = new XMLHttpRequest(); if (xmlhttp.overrideMimeType) { xmlhttp.overrideMimeType("text/xml"); } } else if(window.ActiveXObject) { // IE6,IE5.5,IE5 var activexName = ["MSXML2.XMLHTTP","Miscrosoft.XMLHTTP"]; for (var i = 0; i <activexName.length; i++) { try{ xmlhttp = new ActiveXObject(activexName[i]); break; } catch(e) { } } } if (xmlhttp == undefined || xmlhttp == null) { alert('当前浏览器不支持创建XMLHttpRequest对象，请更换浏览器'); return; }
//2.注册回调方法 xmlhttp.onreadystatechange = callback; //错误的写法 //xmlhttp.onreadystatechange = callback(); // 获取文本框中输入的内容，经过两次编码防止中文乱码 var userName = document.getElementById("UserName").value; userName = encodeURI(encodeURI(userName)); // GET方式交互 // 3.设置和服务器端交互的相应参数 xmlhttp.open("GET","AJAXGB.ashx?name=" + userName,true); // 4.设置向服务器端发送的数据，启动和服务器端的交互 xmlhttp.send(null); /* // POST方式交互 // 3.设置和服务器端交互的相应参数 xmlhttp.open("POST","AJAXGB.ashx",true); // POST方式交互所需要增加的代码 xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); // 4.设置向服务器端发送的数据，启动和服务器端的交互 xmlhttp.send("name=" + userName); */ } function callback() { // 5 .判断和服务器端的交互是否完成，还要判断服务器端是否正确返回了数据 if (xmlhttp.readyState == 4) { // 表示和服务器端的交互已经完成 if (xmlhttp.status == 200) { // 表示服务器的响应代码是200，正确的返回了数据 // 纯文本数据的接受方法 var message = xmlhttp.responseText; // XML数据对应的DOM对象的接受方法 // 使用的前提是，服务器端需要设置content-type为text/xml // var domXml = xmlhttp.responseXML; //向div标签中填充文本内容的方法 var div = document.getElementById("message"); div.innerHTML = message; } } } </script>
</head><body><input type='text' id='UserName' value='牛腩' /><input type='button' οnclick='submit()' value='校验用户名' /><br /><div id="message"></div></body></html>
一般处理程序AJAXGB.ashx源码:
C#代码:
<%@ WebHandler Language="C#" Class="AJAXGB" %>
using System;using System.Web;
public class AJAXGB : IHttpHandler { public void ProcessRequest (HttpContext context) { context.Response.ContentType = "text/plain"; string old = context.Request["name"];
if (string.IsNullOrEmpty(old)) { context.Response.Write("用户名不能为空"); } else { string name = context.Server.UrlDecode(old); if (name.Equals("牛腩")) { context.Response.Write("用户名[" + name + "]已经存在，请使用其他用户名！"); } else { context.Response.Write("用户名[" + name + "]尚未存在，可以使用该用户名注册！"); } } context.Response.End(); } public bool IsReusable { get { return false; } }
}
相关资源：敏捷开发V1.0.pptx