Jquery异步请求方法实例

2015 年 4 月 21 日, iamjs, 0

Jquery支持的异步请求方法有四种，$.get(),$.post(),$.ajax(),$.getJSON()。

一，$.get(url,[data],[callback])

说明：url为请求地址，data为请求数据的列表，callback为请求成功后的回调函数，该函数接受两个参数，第一个为服务器返回的数据，第二个参数为服务器的状态，是可选参数。

而其中，服务器返回数据的格式其实是字符串形势，并不是我们想要的json数据格式，在此引用只是为了对比说明

1
2
3

$.get("data.php",$("#firstName.val()"),function(data){
$("#getResponse").html(data); }//返回的data是字符串类型
);

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

说明：这个函数跟$.get()参数差不多，多了一个type参数，type为请求 的数据类型，可以是html,xml,json等类型，如果我们设置这个参数为：json，那么返回的格式则是json格式的，如果没有设置，就 和$.get()返回的格式一样，都是字符串的

1
2
3
4

$.post("data.php",$("#firstName.val()"),function(data){
$("#postResponse").html(data.name);
},"json"//设置了获取数据的类型，所以得到的数据格式为json类型的
);

============================2018-03-21============================

如果是在form表格中，JQuery也提供了方法直接获取整个表格的方法，这样就可以直接把form的表单直接获取异步传给后端接口：

1

$.post("data.php",$("#form").serialize(),function(data){})

三，$.ajax(opiton)

说明：$.ajax()这个函数功能强大，可以对ajax进行许多精确的控制，需要详细说明的请参照相关资料

1
2
3
4
5
6
7
8
9

$.ajax({
url: "ajax/ajax_selectPicType.aspx",
data:{Full:"fu"},
type: "POST",
dataType:'json',
success:CallBack,
error:function(er){
BackErr(er);}
});

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

1
2
3
4

$.getJSON("data.php",$("#firstName.val()"),function(jsonData){
$("#getJSONResponse").html(jsonData.id);}//无需设置，直接获取的数据类型为json，
所以调用时需要使用jsonData.id方式
);

查看日志的工具–less http_build_query与query_str