jquery Ajax 全局调用封装实例详解

前言：

有一种情况：全站都要用异步方式来调用 数据，提交数据，那么你每次操作 都会要$.ajax({.....})

写重复的方法 和代码，冗余太大， 也浪费时间，虽说你有代码自动提示补全，但真的不优雅，身为前端极客，是不能允许的！

【嘿嘿！虽说我现在基本不用jquery了 ，不过异步概念 是永远要用的，就帮助下新人】

jQuery Ajax通用js封装

第一步：引入jQuery库

第二步：开发Ajax封装类，已测试通过，可以直接调用，直接贴代码，讲解就省了

$(function(){
  
  jQuery.ax=function(url, data, async, type, dataType, successfn, errorfn) {
    async = (async==null || async=="" || typeof(async)=="undefined")? "true" : async;
    type = (type==null || type=="" || typeof(type)=="undefined")? "post" : type;
    dataType = (dataType==null || dataType=="" || typeof(dataType)=="undefined")? "json" : dataType;
    data = (data==null || data=="" || typeof(data)=="undefined")? {"date": new Date().getTime()} : data;
    $.ajax({
      type: type,
      async: async,
      data: data,
      url: url,
      dataType: dataType,
      success: function(d){
 successfn(d);
      },
      error: function(e){
 errorfn(e);
      }
    });
  };
  
  
  jQuery.axpost=function(url, data, successfn) {
    data = (data==null || data=="" || typeof(data)=="undefined")? {"date": new Date().getTime()} : data;
    $.ajax({
      type: "post",
      data: data,
      url: url,
      dataType: "json",
      success: function(d){
 successfn(d);
      }
    });
  };
  
  
  jQuery.axspost=function(url, data, successfn, errorfn) {
    data = (data==null || data=="" || typeof(data)=="undefined")? {"date": new Date().getTime()} : data;
    $.ajax({
      type: "post",
      data: data,
      url: url,
      dataType: "json",
      success: function(d){
 successfn(d);
      },
      error: function(e){
 errorfn(e);
      }
    });
  };



});

第三步：调用模拟

$.axpost(getRootPath()+"/test/ajax.html", null, function(data){
 alert(data.data);
      });

如上代码：只要填写 url，和要传输的 data 字段就行了，避免了重复工作和代码冗余。

感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！