jquery对ajax的支持介绍

1.三个方法

1.1.load方法

//作用：将服务器返回的数据直接添加到符合要求的dom对象上
//相当于 obj.innerHTML = 服务器返回的数据

用法:
$obj.load（url,[请求参数]）;

url : 请求地址
请求参数 :
第一种形式：请求字符串，比如: "username=zs&age=22"
第二种形式：对象,比如 {"username":"zs","age":22}

//注意：
//a, load方法如果没有参数，会使用get方式发请求。如果有参数，会使用post方式发请求。
//b, 如果有中文参数值，load方法已经帮我们做了编码处理。

例子:
复制代码代码如下:
$（function（）{
$（"a.s1"）.toggle（function（）{
var airline = $（this）.parent（）.siblings（）.eq（0）.text（）;
$（this）.next（）.load（"priceInfo.do","airline=" + airline）;
$（this）.html（"显示经济舱价格"）;
},function（）{
$（this）.next（）.empty（）;
$（this）.html（"显示所有票价"）;
}）;
}）;

1.2.$.get（）和$.post（）方法

//作用：向服务器发送get或者post请求（get请求ie有缓存问题）

用法:
$.get（url,[data],[callback],[type]）;
$.post（url,[data],[callback],[type]）;

url : 请求地址
data : 请求参数，形式同上。
callback : 回调函数，可以通过该函数来处理服务器返回的数据。
callback格式：

function（data,statusText），

其中，data可以获得服务器返回的数据,
statusText是一个简单的字符串，描述服务器处理的状态。

type : 服务器返回的数据类型，类型可以是:
html : 返回的是html内容。
text : 返回的是text。
json : 返回的是json字符串
xml : 返回的是dom兼容的xml对象
script: 返回的javascriptz

例子:
复制代码代码如下:
function quoto（）{
$.post（"quoto.do",function（data）{
//如果服务器返回的数据是json字符串,
//会自动转换成js对象或者json对象组成的数组。
$（"#tb1"）.empty（）;
for（i=0;i<data.length;i++）{
$（"#tb1"）.append（
"<tr><td>" + data[i].code
+ "</td><td>" + data[i].name
+ "</td><td>" + data[i].price
+ "</td></tr>"）;
}
},"json"）;t
}

1.3.$.ajax（options）:

//options是一个形如{key1:value1,key2:value2...}的js对象，用于指定发送请求的选项。

选项参数如下：

url（string） : //请求地址
type（string） : //GET/POST
data（object/string） : //发送到服务器的数据
dataType（string） : //预期服务器返回的数据类型
success（function） : //请求成功后调用的回调函数，有两个参数：
function（data,textStatus）,
其中，data是服务器返回的数据,
textStatus 描述状态的字符串。
error（function） : //请求失败时调用的函数，有三个参数
function（xhr,textStatus,errorThrown）,
其中xhr是底层的ajax对象（XMLHttpRequest）,
textStatus,errorThrown这两个参数其中的
一个可以获得底层的异常描述。
async:true（缺省）/false : //当值为false时，发送同步请求。

例子:
复制代码代码如下:
$（function（）{
$（"#s1"）.change（function（）{

$.ajax（{
"url":"carInfo.do",
"type":"post",
"data":"carName="+$（"#s1"）.val（）,
"dataType":"xml",
"success":function（data）{
//data是服务器返回的数据
//如果返回的是xml文档，我们需要使用
//$函数将其包装$（data）成一个jQuery
//对象，方便查找。
//追加之前先清空
$（"#tb1"）.empty（）;
$（"#tb1"）.append（
"<tr><td>制造商:"
+ $（data）.find（"company"）.text（）
+" 价格:" + $（data）.find（"price"）.text（）
+" </td><td>车身大小:"
+ $（data）.find（"size"）.text（）
+ " 门数:" + $（data）.find（"door"）.text（）
+ "</td><td>排量: "
+ $（data）.find（"vol"）.text（）
+ " 加速性能:"
+ $（data）.find（"speed"）.text（）
+ "</td></tr>"）;
//要将表格显示出来
$（"#tips"）.slideDown（"slow"）;
setTimeout（function（）{
$（"#tips"）.fadeOut（"slow"）;
},2000）;
},
"error":function（）{
$（"#tb1"）.append（
"<tr><td colspan="3">该车型信息暂时不可用</td></tr>"）;
$（"#tips"）.slideDown（"slow"）;
}
}）;
}）;
}）;

例子2:
解决中文乱码问题:
复制代码代码如下:
$.ajax（{
"url":"netctoss7/ajaxCode",
"type":"post",
"data":{name:value},
"dataType":"json",
"async":false,
"success":function（data）{
if（data）{
$（"#msg_verCode"）.text（""）;
v1=true;
}else{
$（"#msg_verCode"）.text（"验证码错误"）;
}
}
}）;

2.两个辅助性的方法

2.1.serialize（）:

//将jquery对象包含的表单或者表单控件转换成查询字符串。

2.2.serializeArray（）:

//转换为一个数组，每个数组元素形如{name:fieldName,value:fieldVal}的对象。
//序列化元素的作用，主要是用于ajax请求中，给data赋值。

说明:
只能用于表单或者表单控件
直接把表单的name和对应的value值发送出去,形如:name=value

例子:
复制代码代码如下:
$.ajax（{}）中
//"data":"carName="+$（"#s1"）.val（）,
"data":$（"#s1"）.serialize（）,

//"data":{"carName":$（"#s1"）.val（）},
"data":$（"#s1"）.serializeArray（）,