jQuery的ajax模板整理

jQuery的ajax模板整理

1.常见的jQuery封装的ajax方法

1.$.get(url,params,callback,dataType返回值类型) 请求数据

2.$.post(url,params,callback,dataType返回值类型) 提交数据

3.$.getJSON(url,params,callback) 请求获取json数据时使用

4.$.ajax({url,params,dataType,success,error,同步异步});

5.$.getScript(url,callback); 获取远程js代码

2.通用模板之$.ajax({settings})方法

参数	默认值	描述	可选值
url	“”	请求的链接	string
type	get	请求的方法	get,post
data	null	请求的数据	object,string
contentType	“”	请求头	string
dataType	“”	请求的类型	jsonp
async	true	是否异步	blooean
timeOut	undefined	超时时间	number
before	function(){}	发送之前执行的函数	function
error	function(){}	请求报错执行的函数	function
success	function(){}	请求成功的回调函数	function

$.ajax({
    url: 请求的地址,
    data: 传递给后台的数据,
    method: 请求方法(get,post),
    async: 是否异步(同步:必须等待后台返回数据后程序才会继续往下走，异步:发送后不管是否成功都可以继续往下走),
    beforeSend: 发送到后台前执行的函数，可以用作校验或给按钮添加样式，如果用作校验return false;则可以取消本次请求,
    contentType: 默认值: "application/x-www-form-urlencoded"。发送信息至服务器时内容编码类型,
    dataType:"json"(指定服务器返回的数据类型),
    success: function(data) {
        请求成功的函数，data是后台返回的数据，在这里对数据进行操作
    },
    error: function(err) {
        请求失败，err是失败的内容
    },
    complete: function(e) {
        不管成功还是失败都会调用这个函数
    }
})

模板一

$.ajax({
    url: 请求的地址,
    data: 传递给后台的数据,
    method: 请求方法(get,post),
    async: 是否异步(同步:必须等待后台返回数据后程序才会继续往下走，异步:发送后不管是否成功都可以继续往下走),
    beforeSend: 发送到后台前执行的函数，可以用作校验或给按钮添加样式，如果用作校验return false;则可以取消本次请求,
    contentType: 默认值: "application/x-www-form-urlencoded"。发送信息至服务器时内容编码类型,
    dataType:"json"(指定服务器返回的数据类型),
    success: function(data) {
        请求成功的函数，data是后台返回的数据，在这里对数据进行操作
    },
    error: function(err) {
        请求失败，err是失败的内容
    },
    complete: function(e) {
        不管成功还是失败都会调用这个函数
    }
})

模板二

 $(function(){
        //请求参数
        var list = {};
        //
        $.ajax({
            //请求方式
            type : "POST",
            //请求的媒体类型
            contentType: "application/json;charset=UTF-8",
            //请求地址
            url : "http://127.0.0.1/admin/list/",
            //数据，json字符串
            data : JSON.stringify(list),
            //请求成功
            success : function(result) {
                console.log(result);
            },
            //请求失败，包含具体的错误信息
            error : function(e){
                console.log(e.status);
                console.log(e.responseText);
            }
        });
    });