jQuery的ajax请求方式有好几种,总结一下以方便不用情况选择不同的ajax请求方式。
1. load
载入远程 HTML 文件代码并插入至 DOM 中,默认使用 GET 方式,传递附加参数时自动转换为 POST 方式。
范例代码
2. get/post
通过远程 HTTP GET/POST 请求载入信息。
这是一个简单的 GET/POST 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数,请使用 $.ajax。
范例代码
3. ajax
这个最复杂,功能最全。jQuery 底层 AJAX 实现。
范例代码
error中参数有三个:XMLHttpRequest 对象、错误信息、捕获的错误对象(可选)。
第一个参数,XMLHttpRequest有一些有用的信息:
XMLHttpRequest.readyState: 状态码
0 - (未初始化)还没有调用send()方法
1 - (载入)已调用send()方法,正在发送请求
2 - (载入完成)send()方法执行完成,已经接收到全部响应内容
3 - (交互)正在解析响应内容
4 - (完成)响应内容解析完成,可以在客户端调用了
XMLHttpRequest.status属性:一些错误代码:如200,401,404等。
第二个参数,textStatus除了得到null之外,还可能是"timeout", "error", "notmodified" 和 "parsererror"。
4. getJSON
通过 HTTP GET 请求载入 JSON 数据。
可以通过使用JSONP 形式的回调函数来加载其他网域的JSON数据,如 "myurl?callback=?"。jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。 注意:此行以后的代码将在这个回调函数执行前执行。
1. load
load(url, [data], [callback])
载入远程 HTML 文件代码并插入至 DOM 中,默认使用 GET 方式,传递附加参数时自动转换为 POST 方式。
范例代码
$("#feeds").load("feeds.php", {limit: 25}, function(){
alert("The last 25 entries in the feed have been loaded");
});
2. get/post
jQuery.get(url, [data], [callback], [type])
通过远程 HTTP GET/POST 请求载入信息。
这是一个简单的 GET/POST 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数,请使用 $.ajax。
范例代码
$.get("test.cgi", { name: "John", time: "2pm" },
function(data){
alert("Data Loaded: " + data);
});
3. ajax
jQuery.ajax([options])
这个最复杂,功能最全。jQuery 底层 AJAX 实现。
范例代码
$.ajax({
type: "GET",
url: "test.js",
dataType: "script"
});
$.ajax({
type: "POST",
url: "some.php",
data: "name=John&location=Boston",
success: function(msg){
alert( "Data Saved: " + msg );
},
error:function (XMLHttpRequest, textStatus, errorThrown){
}
});
error中参数有三个:XMLHttpRequest 对象、错误信息、捕获的错误对象(可选)。
第一个参数,XMLHttpRequest有一些有用的信息:
XMLHttpRequest.readyState: 状态码
0 - (未初始化)还没有调用send()方法
1 - (载入)已调用send()方法,正在发送请求
2 - (载入完成)send()方法执行完成,已经接收到全部响应内容
3 - (交互)正在解析响应内容
4 - (完成)响应内容解析完成,可以在客户端调用了
XMLHttpRequest.status属性:一些错误代码:如200,401,404等。
第二个参数,textStatus除了得到null之外,还可能是"timeout", "error", "notmodified" 和 "parsererror"。
4. getJSON
jQuery.getJSON(url, [data], [callback])
通过 HTTP GET 请求载入 JSON 数据。
可以通过使用JSONP 形式的回调函数来加载其他网域的JSON数据,如 "myurl?callback=?"。jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。 注意:此行以后的代码将在这个回调函数执行前执行。
$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=?", function(data){
$.each(data.items, function(i,item){
$("<img/>").attr("src", item.media.m).appendTo("#images");
if ( i == 3 ) return false;
});
});