c# asp.net js 实现异步调用 ajax基础

2009-07-15 17:58

具体实现功能 ：实现无刷新 检测用户名 是否存在 其实使用下面的代码 改一改 可以实现好多ajax功能 快下班了写的有些简便 具体如下： js 文件： // JScript 文件 var xmlHttp; //创建异步对象 function createXMLHttpRequest1() {     if (window.ActiveXObject)     {         xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");     }     else if (window.XMLHttpRequest)     {         xmlHttp = new XMLHttpRequest();     } } //创建 发送字符串url function createQueryString1() {     var firstName = document.getElementById("firstName").value;     var queryString = "firstName1="+ firstName;     return queryString; } //使用get方法 异步处理 function doRequestUsingGET1() {     createXMLHttpRequest1();     var queryString = "CheckfirstName.aspx?"; //在 CheckfirstName 检测用户名     queryString = queryString + createQueryString1()             //方法 handleStateChange1 没有参数 直接使用方法名字引用     xmlHttp.onreadystatechange = handleStateChange1;         //如果 有参数就是 下面的例子：     //xmlHttp.onreadystatechange = function(){ handleStateChange1(参数)}     xmlHttp.open("GET", queryString, true);     xmlHttp.send(null); } //使用 post方法 异步处理 function doRequestUsingPOST1() {     createXMLHttpRequest1();     var url = "CheckfirstName.aspx?timeStamp=" + new Date().getTime();//在 CheckfirstName 检测用户名     var queryString = createQueryString1();     xmlHttp.open("POST", url, true);         //相当于 委托中的 匿名方法     xmlHttp.onreadystatechange = function()     {        if(xmlHttp.readyState == 4)         {             if(xmlHttp.status == 200)             {                        // alert("dd");                 parseResults1();                 //完成异步             }         }           }         xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded;");     xmlHttp.send(queryString); } //获取异步状态 作出相对响应---回调方法 function handleStateChange1() {     if(xmlHttp.readyState == 4)     {         if(xmlHttp.status == 200)         {                    // alert("dd");             parseResults1();         }     } } //异步完成 执行方法 function parseResults1() { //    var responseDiv = document.getElementById("serverResponse"); //    if(responseDiv.hasChildNodes()) //    { //        responseDiv.removeChild(responseDiv.childNodes[0]); //    } //    var responseText = document.createTextNode(xmlHttp.responseText); //    responseDiv.appendChild(responseText);         //获取服务端回传的数据     var responseDiv = document.getElementById("username");     responseDiv.innerHTML=xmlHttp.responseText; } Default.aspx ： 首先引入 上面的js文件 <script type="text/javascript" src="JScript.js"></script> 在这个页面随便放个button （客户端控件）或 textbox （客户端控件）随便测试下就行了 在button clicke事件 或 text changge事件 中调用 doRequestUsingGET1() 或 doRequestUsingPOST1() 方法 服务端： CheckfirstName.aspx：   也就是上面js文件中 的doRequestUsingPOST1 和 doRequestUsingGET1方法 var queryString = "CheckfirstName.aspx?"; //这句代码 中的CheckfirstName.aspx（也就是异步请求的服务端） 页面没什么内容 在onload 事件中写： protected void Page_Load(object sender, EventArgs e)     {         if (Request["firstName1"] != null)         {            string s= checkName(Request["firstName1"].ToString());            Response.Clear();            Response.Write("<h1>"+s+"</h1>");            Response.End();         }     }    //下面checkName 方法在这里我就简单做一下逻辑上的判断 其实应该是查询数据库... 之类的操作    public string checkName(string name)     {         string uname = "";         if (name == "123")         {             uname = "<h1>已经注册</h1>";         }         else         {             uname = "合法";         }         return uname;     } 到这里就可以测试    由于时间原因 没有整理好 大家将就先用下 有时间在整理一下 关于向服务器发送xml 及接收的问题