jQuery ajax：Baidu ajax

jQuery ajax：Baidu ajax2013-10-18 cnblogs Justany_WhiteSnow你没有看错标题，本文的确是在讲Baidu ajax，不过是很久很久以前的版本了。

由于jQuery ajax模块有800+行，而核心函数jQuery.ajax就有380+行，直接分析这段代码很容易被代码逻辑弄晕。

所以我们先分析一段简单的ajax代码，来自早期的百度七巧板项目。

通过这个来先复习一遍ajax的知识。

baidu.ajax.request分离版

/** * 发送一个ajax请求 * @author: allstar, erik, berg * @name ajax.request * @function * @grammar ajax.request（url[, options]） * @param {string} url 发送请求的url * @param {Object} options 发送请求的选项参数 * @config {String} [method] 请求发送的类型。默认为GET * @config {Boolean}[async] 是否异步请求。默认为true（异步） * @config {String} [data] 需要发送的数据。如果是GET请求的话，不需要这个属性 * @config {Object} [headers] 要设置的http request header * @config {number} [timeout] 超时时间，单位ms * @config {String} [username] 用户名 * @config {String} [password] 密码 * @config {Function} [onsuccess] 请求成功时触发，function（XMLHttpRequest xhr, string responseText）。 * @config {Function} [onfailure] 请求失败时触发，function（XMLHttpRequest xhr）。 * @config {Function} [onbeforerequest]发送请求之前触发，function（XMLHttpRequest xhr）。 ** @meta standard * @see ajax.get,ajax.post ** @returns {XMLHttpRequest} 发送请求的XMLHttpRequest对象 */var ajax = {};ajax.request = function（url,options,type）{// 是否需要异步var async = options.async||true,// 用户名、密码username = options.username||"",password = options.password||"",// 需要传输的数据data = options.data||"",// GET还是POSTmethod = （options.method||"GET"）.toUpperCase（）,// 请求头headers = options.headers||{},// 事件处理函数表eventHandler = {},// 请求数据类型dataType = type||"string";//xml||stringfunction stateChangeHandler（）{// 看看是否已经准备好了if（xhr.readyState == 4）{// 得到xhr当前状态var sta = xhr.status;// 判断是否成功if（sta == 200||sta == 304）{// 成功则触发成功fire（"success"）;}else{// 失败则触发失败fire（"failure"）;}// 清除绑定window.setTimeout（function（）{xhr.onreadystatechange= new Function（）;if （async）{xhr = null;}},0）;}}function fire（type）{// 把type变成ontypetype = "on"+type;// 在事件处理器表中找到对应事件的处理函数var handler = eventHandler[type];// 如果函数存在，则if（handler）{// 不成功的话if（type ！= "onsuccess"）{handler（xhr）;// 成功了}else{// 则根据dataType返回不同的数据handler（xhr,dataType！="xml"？xhr.responseText:xhr.responseXML）;}}}// 组装eventHandlerfor（var key in options）{eventHandler[key] = options[key];}// 新建一个XMLHttpRequest对象var xhr = new XMLHttpRequest（）;// 如果方法是GET，则把数据组装到url中if（method == "GET"）{url += （url.indexOf（"？"）>=0）？"&":"？";url += data;// 清空datadata = null;}// 如果是异步if （async）{// 绑定readystatechange的处理器xhr.onreadystatechange = stateChangeHandler;}// 看看是否需要输入密码if（username）{xhr.open（method,url,async,username,passowrd）;}else{xhr.open（method,url,async）;}// 如果是POSTif（method == "POST"）{// 设置一下请求头xhr.setRequestHeader（"Content-Type", "application/x-www-form-urlencoded"）;}// 把options中的请求头信息全部设置进去for（var key in headers）{xhr.setRequestHeader（name,headers[key]）}// 触发事件beforerequestfire（"beforerequest"）;// 发送数据xhr.send（data）;// 如果不是异步if （！async）{// 则直接运行stateChangeHandler来处理数据stateChangeHandler（）;}return xhr;}