【jQuery】jQuery中的Ajax

加载异步（静态）数据

load()  - 加载html格式数据

语法格式为：

load(url, [data], [callback])

参数url为被加载的页面地址，可选项[data]参数表示发送到服务器的数据，其格式为 key / value ，另一个可选项 [callback] 表示参数加载成功后，返回至加载页的回调函数。

全局函数 - getJSON() - 加载json格式数据

用于调用JSON格式的数据，其调用的语法格式为：

$.getJSON(url, [data], [callback])

参数url表示请求的地址，可选项[data]参数表示发送到服务器的数据，其格式为key/value，可选项[callback]参数表示加载成功时执行的回调函数。

例如：

$("#Button1").click(function(){    $.getJSON("userinfo.json", function(data){        $("#divTip").empty();        var strHTML = "";        $.each(data, function(InfoIndex, Info){            strHTML += "姓名" + Info["name"]  + "";            strHTML += "性别" + Info["sex"]   + "";            strHTML += "邮箱" + Info["email"] + "";        })        $("#divTip").html(strHTML);    })})

userinfo.json:

{  {     "name": "1",     "sex":"2",     "email":"3"  },  {    "name":"4",    "sex":"5",    "email":"6"  }}

全局函数 - getScript() - 加载js格式数据

用于获取.js文件的内容。在jQuery中，通过全局函数getScript()加载.js文件后，不仅可以像加载页面片段一样轻松地注入脚本，而且所注入的脚本自动执行。

其调用格式如下：

$.getScript(url, [callback])

url参数为等待加载的JS文件地址，可选项[callback]参数表示加载成功时执行的回调函数。

例如：

$("Button1").click(function(){    $.getScript("userinfo.js");})

userinfo.js

var data = [  {    "name":"1",    "sex":"2",    "email":"3"  },  {    "name":"4",    "sex":"5",    "email"：“6”  }];var strHTML = "";$.each(data, function(){    strHTML += "姓名" + this["name"]  + "";    strHTML += "性别" + this["sex"]   + "";    strHTML += "邮箱" + this["email"] + "";})$("#divTip").html(strHTML);

全局函数 - get() - 加载html, xml, js, json, text等格式数据

调用的语法格式为：

$.get(url, [data], [callback], [type])

参数url表示等待加载的数据地址，可选项[data]参数表示发送到服务器的数据，其格式为key/value，可选项[callback]参数表示加载成功时执行的回调函数，可选项[type]参数表示返回数据的格式，如html, xml, js, json, text等

请求服务器（动态）数据

$.get()请求数据

客户端向服务器传递参数时，使用的格式是{key0:value0, key1:value1, ... ... }，如果参数的值是中文格式，必须通过使用encodeURL()来进行转码，在客户端接受时，使用decodeURL进行解码即可。

函数格式参见上一节。

$.post()请求数据

$.post()也是带参数向服务器发出数据请求。全局函数$.post()与$.get()在本质上没有太大的区别，所不同的是，GET方式不适合传递数据量较大的数据，同时，其请求的历史信息会保存在浏览器的缓存中。

$.post()函数调用的语法格式如下：

$.post(url, [data], [callback], [type])

serialize()序列化表单

该方法的功能将所选择的DOM元素转换成能随AJAX传递的字符串，即序列化所选的DOM元素。

例如：

$.post("userinfo.aspx",        $("#frmuserinfo").serialize(),       function(data){... ...})

serialize()方法自身有很多的不足，如表单中有多项被选中时，该方法只能传递一项的值，因此，在选择传递参数时，须慎重考虑。

$.ajax()方法

$.ajax()的基本概念

在jQuery中，$.ajax()方法是最底层的方法，也是功能最强的方法。

其调用的语法格式为：

$.ajax([options])

可选项参数[options]为$.ajax()方法中的请求设置，其格式为 key / value ，即包含发送请求的参数，也含有服务器响应后回调的数据。

$.ajax()方法中的参数列表：

参数名类型描述urlString发送请求的地址（默认为当前页面）typeString数据请求的方式（post 或 get），默认为getdataString或Object发送到服务器的数据，如果不是字符串则自动转换成字符串格式，如果是get请求方式，那么，该字符串将附在url的后面dataTypeString服务器返回的数据类型，如果没有指定，jQuery将自动根据HTTP包MIME信息自动判断，服务器返回的数据根据自动判断的结果进行解析，传递给回调函数，其可用类型为：
html：返回纯文本的HTML信息，包含的Script标记会在插入页面时被执行
script：返回纯文本JavaScript代码
text：返回纯文本的字符串
xml：返回可被jQuery处理的XML文档
json：返回JSON格式的数据beforeSendFunction该函数用于发送请求前修改XMLHttpRequest对象，其中的参数就是XMLHttpRequest对象，由于该函数本身是jQuery事件，因此，如果函数返回false，则表示取消本次事件completeFunction请求完成后调用的函数，该函数无论数据发送成功或失败都会调用，其中有两个参数，一个是XMLHttpRequest对象，另外一个是strStatus，用于描述成功请求类型的字符串successFunction请求成功后返回的回调函数，该函数有两个函数，一个是根据参数datType处理后服务器返回的数据，另外一个是strStatus，用于描述状态的字符串errorFunction请求失败后调用的函数，该函数有三个参数，第一个是XMLHttpRequest对象，第二个是出错信息strError，第三个是捕捉到的错误对象strObjecttimeoutNumber请求超时的时间（毫秒）globalBoolean是否响应全局事件，默认是true，表示响应，如果设置成false，表示是不响应asyncBoolean是否为异步请求，默认为true，表示是异步，如果设置成false，表示是同步请求cacheBoolean是否进行页面缓存，true表示进行缓存，false表示不进行页面缓存

$.ajaxSetup()设置全局Ajax

在jQuery中，可以使用$.ajaxSetup()方法设置全局性的ajax默认选项，一次设置，全局有效。

调用格式为：

$.ajaxSetup([options])

可选参数[options]是一个对象，通过该对象可以设置$.ajax()方法中的参数。

Ajax中的全局事件

jQuery中的 6 个全局Ajax事件如下：

事件名称参数功能描述ajaxComplete(callback)callbackAjax请求完成时执行函数ajaxError(callback)callbackAjax请求发送错误时执行函数，其中捕捉到的错误可以作为最后一个参数进行传递ajaxSend(callback)callbackAjax请求发送前执行函数ajaxStart(callback)callbackAjax请求开始时执行函数ajaxStop(callback)callbackAjax请求结束时执行函数ajaxSuccess(callback)callbackAjax请求成功时执行函数

在jQuery中，所有的全局事件都是以XMLHttpRequest对象和设置对象作为参数传递给回调函数。

在事件绑定时，Ajax中的全局事件可以绑定在页面的任何一个元素中。