AJAX客户端说明，XMLHttpRequest对象

答案：在CommunityServer中运用了自己的AJAX机制，没有借助其他的辅助控件。其中客户的XMLHttpRequest对象的封装，就足以让人大饱眼福，在一般的浏览器其都能够运行AJAX。下面我们来学习学习这个咚咚，希望能给更多的人带来帮助。 

 首先当然是要了解一下浏览器中的XMLHttp对象了： 

 XMLHTTP方法：  
         备注：客户机可以使用XMLHTTP对象发送任意的HTTP请求,接受HTTP应答,还可以对应答的XML文档进行解析。  

         Open方法：初始化一个Msxml2.XMLHTTP请求，指定HTTP请求方式、URL以及鉴定信息。 

        语法： 
         Open（ bstrMethod, bstrUrl, varAsync, bstrUser, bstrPassword ）  

        参数介绍： 

        bstrMethod： 数据传送方式，即GET或POST。  
         bstrUrl： 服务网页的URL。  
         varAsync： 是否同步执行。缺省为True，即同步执行，但只能在DOM中实施同步执行。用中一般将其置为False，即异步执行。  
         bstrUser： 用户名，可省略。  
         bstrPassword：用户口令，可省略。  

        Send方法：发送HTTP请求到服务器，返回应答。  

        语法：  
        oXMLHttpRequest.send(varBody)  

       说明：此方法是否同步取决于Open方法的varAsync参数。如果设为True则为同步，调用立刻返回，如果设为False调用直到整个应答被接收了才返回。  

        setRequestHeader（ bstrHeader, bstrvalue ） 

        bstrHeader：HTTP 头(header)  
        bstrvalue： HTTP 头(header)的值  

       如果Open方法定义为POST，可以定义表单方式上传：  
       xmlhttp.setRequestHeader（ "Content-Type", "application/x-www-form-urlencoded"）  

XMLHTTP属性：  

 onreadystatechange：在同步执行方式下获得返回结果的事件句柄。只能在DOM中调用。  
 responseBody： 结果返回为无符号整数数组。  
 responseStream： 结果返回为IStream流。  
 responseText ： 结果返回为字符串。  
 responseXML： 结果返回为XML格式数据。 

 运用这个原理也可以做网络小偷程序，网络爬虫应该就是应用这个东西来完成的吧，不过我没有做过，可能在不久的将来会制作个来玩玩，这里我们最主要的是看看CS中是如何封装他的： 

   1//Ajax Start 
 2/**////<summary> 
 3///创建回调对象，如果存在window.XMLHttpRequest()对象,则返回此对象，如果是IE则搜索Msxml2.XMLHTTP各个版本及Microsoft.XMLHTTP并创建对象返回。 
 4///</summary> 
 5function Ajax_GetXMLHttpRequest() { 
 6    if (window.XMLHttpRequest) { 
 7        return new XMLHttpRequest(); 
 8    } else { 
 9        if (window.Ajax_XMLHttpRequestProgID) { 
            return new ActiveXObject(window.Ajax_XMLHttpRequestProgID); 
        } else { 
            var progIDs = ["Msxml2.XMLHTTP.5.0", "Msxml2.XMLHTTP.4.0", "MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP", "Microsoft.XMLHTTP"]; 
            for (var i = 0; i < progIDs.length; ++i) { 
                var progID = progIDs[i]; 
                try { 
                    var x = new ActiveXObject(progID); 
                    window.Ajax_XMLHttpRequestProgID = progID; 
                    return x; 
                } catch (e) { 
                } 
            } 
        } 
    } 
    return null; 
} 
/**////<summary> 
///Ajax回调。 
///</summary> 
///<param name="type">调用服务端函数所在的类包括命名空间(如：NExplus.Controls.SiteHeader)。</param> 
///<param name="id">客户端所对应的标记的ID(如：<div id="ID"></div>)。</param> 
///<param name="method">服务端(方法)函数名称(被AjaxMethod标记)。</param> 
///<param name="args">传到服务器的字符串。</param> 
///<param name="clientCallBack">同步或异步回调。</param> 
///<param name="debugRequestText">调试/请求字符串。</param> 
///<param name="debugResponseText">调试/输出字符串。</param> 
///<param name="debugErrors">调试的错误信息。</param> 
///<param name="includeControlValuesWithCallBack">是否和控件及其值一起回调。</param> 
///<param name="url">Url地址。</param> 
function Ajax_CallBack(type, id, method, args, clientCallBack, debugRequestText, debugResponseText, debugErrors, includeControlValuesWithCallBack, url) { 

    if (!url) 
    { 
        url = window.location.href; 
        url = url.replace(/\#.*$/, '');//去除URL中标签部分，即"#"之后的字符串。 
        //加入参数Ajax_CallBack并设为true,说明是AJAX回调。 
        if (url.indexOf('?') > -1) 
            url += "&Ajax_CallBack=true"; 
        else 
        { 
            if (url.substr(url.length - 1, 1) == "/") 
                url += "default.aspx"; 

            url += "?Ajax_CallBack=true"; 
        } 
    } 

    var x = Ajax_GetXMLHttpRequest();//取得XMLHttpRequest对象。 
    var result = null; 
    if (!x) { 
        result = { "value":null, "error": "NOXMLHTTP"}; 
        if (debugErrors) { 
            alert("error: " + result.error); 
        } 
        if (clientCallBack) { 
            clientCallBack(result); 
        } 
        return result; 
    } 

    x.open("POST", url, clientCallBack ? true : false);//以Post方式打开对象，这样在服务端就可以用Request.Form获取参数。 
    x.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=utf-8"); 
    if (clientCallBack) { 
        //如果同步，判断状态，输出错误消息。 
        x.onreadystatechange = function() { 
            var result = null; 

            if (x.readyState != 4) { 
                return; 
            } 

            if (debugResponseText) { 
                alert(x.responseText); 
            } 

            try 
            { 
                var result = eval("(" + x.responseText + ")"); 
                if (debugErrors && result.error) { 
                    alert("error: " + result.error); 
                } 
            } 
            catch (err) 
            { 
                if (window.confirm('The following error occured while processing an AJAX request: ' + err.message + '\n\nWould you like to see the response?')) 
                { 
                    var w = window.open(); 
                    w.document.open('text/plain'); 
                    w.document.write(x.responseText); 
                   w.document.close(); 
               } 

               result = new Object(); 
               result.error = 'An AJAX error occured.  The response is invalid.'; 
           } 

           clientCallBack(result);             
       } 
   } 
   var encodedData = "Ajax_CallBackType=" + type; 
   if (id) { 
       encodedData += "&Ajax_CallBackID=" + id.split("$").join(":"); 
   } 
   encodedData += "&Ajax_CallBackMethod=" + method; 
   if (args) { 
       for (var i in args) { 
           encodedData += "&Ajax_CallBackArgument" + i + "=" + encodeURIComponent(args[i]); 
       } 
   } 
   //如果加入控件，则加入控件数据。 
   if (includeControlValuesWithCallBack && document.forms.length > 0) { 
       var form = document.forms[0]; 
       for (var i = 0; i < form.length; ++i) { 
           var element = form.elements[i]; 
           if (element.name) { 
               var elementValue = null; 
               if (element.nodeName == "INPUT") { 
                   var inputType = element.getAttribute("TYPE").toUpperCase(); 
                   if (inputType == "TEXT" || inputType == "PASSWORD" || inputType == "HIDDEN") { 
                       elementValue = element.value; 
                   } else if (inputType == "CHECKBOX" || inputType == "RADIO") { 
                       if (element.checked) { 
                           elementValue = element.value; 
                       } 
                   } 
               } else if (element.nodeName == "SELECT") { 
                   elementValue = element.value; 
               } else if (element.nodeName == "TEXTAREA") { 
             

上一个：天枫AJAX天气预报系统V1.0
下一个：用Ajax来控制书签和回退按钮的代码