Android 转web app(二) JQuery Ajax 网络请求封装-原创手记-慕课网

先看一个基本的JQuery Ajax请求

$.ajax({
    url: "",    //请求的url地址
    dataType: "json",   //返回格式为json
    async: true, //请求是否异步，默认为异步，这也是ajax重要特性
    data: { "id": "value" },    //参数值
    type: "GET",   //请求方式
    beforeSend: function() {
        //请求前的处理
    },
    success: function(req) {
        //请求成功时处理
    },
    complete: function() {
        //请求完成的处理
    },
    error: function() {
        //请求出错处理
    }
});

通过代码可以看到，Jquery 已经为我们做了很好的封装，几行代码就可以实现网络请求访问。作为一个Android狗，看到这样的代码倍感情切。这和Android中的AsyncTask 简直就是失散多年的亲兄弟。一切网络请求前后的通用化处理，返回结果的通用化处理，经过简单的封装，就可以为我们节省大把的开发时间。
封装之前需要先介绍Jquery中的$.extends，类似于Java中的extends。其结构为$.extends(obj1,obj2,....); obj2会覆盖obj1。简单看个例子

var obj1={name: "张三",age: "18",success:function(){}}
var obj2={age: "20",success:function(){ alert("重载方法") }}
var obj3=$.extend(obj1,obj2);
//结果:obj1的age属性被覆盖,而且继承了obj1的name属性,重写了success方法
obj3= {{name: "张三",age: "20",success:function(){ alert("重载方法") }}

利用$.extends封装之后

function aj(opt){
    var def={
    // flag: 1,
        type:"post",
        dataType:"json",
        data:{},
        async:false,
        success:function(data){},
        beforeSend:function(){}
    };
    $.extend(def,opt);
    $.ajax({
        url:url+def.url,
        type:def.type,
        dataType:def.dataType,
        async:def.async,
        data:def.data,

        success: function(json){

            if(json.hasOwnProperty("error")){
                alert(json.errorMsg);
            }else{
                def.success(json);
            }
        },
        beforeSend:function(){
            showLoadingDialog();
        },
        error:function(){
            alert("出错了!");
        }
        complete:function(){
            closeLoadingDialog();
        }
    });
}

在网络请求开始之前，显示正在加载Dialog，网络请求结束，关闭Dialog，对错误结果进行统一处理。来看下使用

function loadData() {
        aj({
            type : "get",
            data : {
                aid : aid
            },
            url : '/active/detail',
            success : function(data) {

            }
        });
}

代码更加清爽简介