Jquery Ajax的封装

最近做代码的优化需要精简下代码
1.对于jquery总ajax不变的参数封入函数内部
2.对于需要传递的参数则传递到函数内部
主要实现思路
1.配置一个对象 对象的exeScript为一个函数
2.exeScript的函数形参来配置ajax的各个参数
参数说明
1.type 配置各种请求(例如:get post push...)
2.url两部分组成 rootUrl为接口服务器 option.url为接口的二级路径或方法名
3.data 为接口的参数 对此进行转化为字符串形式
4.关于dataType 的配置 写死了为json形式当然也可以配置为其他形式
5.beforeSend 可以传递一个函数(例如loading函数)满足各个需求
代码如下

var rootUrl='http://192.168.1.111:8000';
var Ajax = {};
Ajax.exeScript = function(option) {
    var dataType='';
    option.dataType?dataType=option.dataType:dataType='post';
    if(!option.beforeSend){
        function beforeSend(){
            $('body').append('<div class="loadingBox"><div class="loader"><span class="text">Loading</span><span class="spinner"></span> </div> </div>');
        };
    };
    $.ajax({
        type : option.type,
        url : rootUrl + option.url,
        data :JSON.stringify(option.data),
        async: false,
        dataType:dataType,
        contentType: "application/json;charset=utf-8",
        beforeSend:beforeSend,
        success : function(data) {
            if (option.success && $.isFunction(option.success)) {
                
            }
        },
        error : function(xhr, type) {
            if (option.error && $.isFunction(option.error)) {
                
            }
        }
    });
};

函数调用示例代码如下

function test() {
        var data = {"userNo":'',"amount" :''};
        Ajax.exeScript({
            type : "post",
            url : '/test/test.do',
            data : data,
            success : function(data) {
                console.log(JSON.stringify(data));
            },
            error : function(err) {
                console.log(JSON.stringify(err));
            },
        });
    }
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容