jQuery的ajax详解
jQuery内部也封装了对原生ajax请求的方法,可以很方便我们的对后台异步请求处理。
$.get()方法
【jQuery的ajax详解】语法:jQuery.get( url [, data ] [, success ] [, dataType ] )
- url 请求的后台地址
- data 传递的参数
- success 成功的回调,
function(PlainObject data, String textStatus, jqXHR jqXHR )
- dataType 预期后台返回数据的类型,默认会自动智能判断(xml, json, script, text, html)
$.get('/user.json', function(data) {
console.log(data);
});
$.get('/user.json', 'id=1', function (data, status, jsXHR) {
console.log(data.id);
}, 'json');
$.post()方法
语法:
jQuery.post( url [, data ] [, success ] [, dataType ] )
用法跟get基本一致。列子:
$.post('/api/user', {id: 3, name: 234}, function(data, status, jsXHR) {
console.log(data);
});
$.ajax()方法
语法1:
jQuery.ajax( [settings ] )
settings 是一个普通的对象。可以有如下设置:
- async 类型:Boolean
注意,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行。
- beforeSend(XHR) 类型:Function
XMLHttpRequest 对象是唯一的参数。
这是一个 Ajax 事件。如果返回 false 可以取消本次 ajax 请求。
- cache 类型:Boolean
- contentType 类型:String
- data 类型:String
- dataType 类型:String
预期服务器返回的数据类型。 (xml、html、script、json、jsonp、text)。jq会将自动根据 HTTP 包 MIME 信息来智能判断,比如 XML MIME 类型就被识别为 XML。
- error 类型:Function
有以下三个参数:XMLHttpRequest 对象、错误信息、(可选)捕获的异常对象。
如果发生了错误,错误信息(第二个参数)除了得到 null 之外,还可能是 "timeout", "error", "notmodified" 和 "parsererror"。
- success 类型:Function
参数:由服务器返回,并根据 dataType 参数进行处理后的数据;描述状态的字符串。
这是一个 Ajax 事件。
- type 类型:String
- url 类型:String
- jsonp 类型:String
- jsonpCallback 类型:String
语法2:
jQuery.ajax( url [, settings ] )
$.ajax({
url: 'user.json',
data: 'id=3',
type: 'GET',
success: function(data) {
console.log(data);
}
});
$.getJSON()
语法:
jQuery.getJSON( url [, data ] [, success ] )
用法类似于get,但是返回的数据类型自动转换为json对象。
此方法,支持JSONP的调用。如果url中包含了
callback=?
或者后台要求的callback参数,那么此方法自动转换成jsonp的调用模式。$.getJSON('user.json', function(data) {
console.log(data.id);
});
jQuery.getScript()方法
执行后台的请求,并下载js脚本,下载完成后,自动执行。
语法:
jQuery.getScript( url [, success ] )
$.getScript( "ajax/test.js", function( data, textStatus, jqxhr ) {
console.log( data );
// Data returned
console.log( textStatus );
// Success
console.log( jqxhr.status );
// 200
console.log( "Load was performed." );
});
load()方法
从后台下载html内容,下载完成后替换到选择元素的内部。
语法:
$(selector).load( url [, data ] [, complete ] )
$('.box').load('/user/list', {}, function(data) {});
推荐阅读
- 热闹中的孤独
- JAVA(抽象类与接口的区别&重载与重写&内存泄漏)
- 放屁有这三个特征的,请注意啦!这说明你的身体毒素太多
- 一个人的旅行,三亚
- 布丽吉特,人生绝对的赢家
- 慢慢的美丽
- 尽力
- 一个小故事,我的思考。
- 家乡的那条小河
- 《真与假的困惑》???|《真与假的困惑》??? ——致良知是一种伟大的力量