jQuery版AJAX简易封装代码


Posted in Javascript onSeptember 14, 2016

开发过程中,AJAX的应用应该说非常频繁,当然,jQuery的AJAX函数已经非常好用,但是小编还是稍微整理下,方便不同需求下,可以简化输入参数,下面是实例代码:

$(function(){
  /**
   * ajax封装
   * url 发送请求的地址
   * data 发送到服务器的数据,数组存储,如:{"date": new Date().getTime(), "state": 1}
   * async 默认值: true。默认设置下,所有请求均为异步请求。如果需要发送同步请求,请将此选项设置为 false。
   *    注意,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行。
   * type 请求方式("POST" 或 "GET"), 默认为 "GET"
   * dataType 预期服务器返回的数据类型,常用的如:xml、html、json、text
   * successfn 成功回调函数
   * errorfn 失败回调函数
   */
  jQuery.syncAjax=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);
      }
    });
  };
  
  /**
   * ajax封装
   * url 发送请求的地址
   * data 发送到服务器的数据,数组存储,如:{"date": new Date().getTime(), "state": 1}
   * successfn 成功回调函数
   */
  jQuery.jsonAjax=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);
      }
    });
  };
  
  /**
   * ajax封装
   * url 发送请求的地址
   * data 发送到服务器的数据,数组存储,如:{"date": new Date().getTime(), "state": 1}
   * dataType 预期服务器返回的数据类型,常用的如:xml、html、json、text
   * successfn 成功回调函数
   * errorfn 失败回调函数
   */
  jQuery.jsonAjax2=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);
      }
    });
  };



});

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript 指导方针
Apr 05 Javascript
JavaScript 对象成员的可见性说明
Oct 16 Javascript
JavaScript 小型打飞机游戏实现原理说明
Oct 28 Javascript
Jquery中getJSON在asp.net中的使用说明
Mar 10 Javascript
javascript数组操作(创建、元素删除、数组的拷贝)
Apr 07 Javascript
详解JavaScript对象的深浅复制
Mar 30 Javascript
vue引入jq插件的实例讲解
Sep 12 Javascript
Redux实现组合计数器的示例代码
Jul 04 Javascript
JS函数进阶之prototy用法实例分析
Jan 15 Javascript
JS性能优化实现方法及优点进行
Aug 30 Javascript
js+canvas绘制图形验证码
Sep 21 Javascript
Vue 3.0中jsx语法的使用
Nov 13 Javascript
原生JS实现首页进度加载动画
Sep 14 #Javascript
jquery判断iPhone、Android设备类型
Sep 14 #Javascript
Angularjs 实现分页功能及示例代码
Sep 14 #Javascript
Angularjs CURD 详解及实例代码
Sep 14 #Javascript
Angular Module声明和获取重载实例代码
Sep 14 #Javascript
javascript经典特效分享 手风琴、轮播图、图片滑动
Sep 14 #Javascript
Angular 应用技巧总结
Sep 14 #Javascript
You might like
S900/ ETON E1-XM 收音机
2021/03/02 无线电
建立动态的WML站点(一)
2006/10/09 PHP
php 更新数据库中断的解决方法
2009/06/05 PHP
php 生成WML页面方法详解
2009/08/09 PHP
php汉字转拼音的示例
2014/02/27 PHP
yii实现model添加默认值的方法(2种方法)
2016/01/06 PHP
PHP实现的mongoDB数据库操作类完整实例
2018/04/10 PHP
PHP 实现文件压缩解压操作的方法
2019/06/14 PHP
javascript开发技术大全-第1章javascript概述
2011/07/03 Javascript
javascript中判断json的方法总结
2015/08/27 Javascript
简单的JS时钟实例讲解
2016/01/13 Javascript
Node.js本地文件操作之文件拷贝与目录遍历的方法
2016/02/16 Javascript
AngularJS 最常用的功能汇总
2016/02/17 Javascript
Javascript设计模式之观察者模式(推荐)
2016/03/29 Javascript
原生js实现ajax方法(超简单)
2016/09/20 Javascript
JavaScript之WebSocket技术详解
2016/11/18 Javascript
Angular2利用组件与指令实现图片轮播组件
2017/03/27 Javascript
vue2中filter()的实现代码
2017/07/09 Javascript
JS实现简单的星期格式转换功能示例
2018/07/23 Javascript
解决vue js IOS H5focus无法自动弹出键盘的问题
2018/08/30 Javascript
JavaScript检查数据中是否存在相同的元素(两种方法)
2018/10/07 Javascript
js校验开始时间和结束时间
2020/05/26 Javascript
Vue单文件组件开发实现过程详解
2020/07/30 Javascript
Python使用MySQLdb for Python操作数据库教程
2014/10/11 Python
pandas通过loc生成新的列方法
2018/11/28 Python
python写入文件自动换行问题的方法
2019/07/05 Python
numpy.transpose()实现数组的转置例子
2019/12/02 Python
在python中利用try..except来代替if..else的用法
2019/12/19 Python
奥地利体育网上商店:Gigasport
2019/10/09 全球购物
Java里面如何把一个Array数组转换成Collection, List
2013/07/26 面试题
儿媳婚宴答谢词
2014/01/14 职场文书
妈妈的账单教学反思
2014/02/06 职场文书
敲诈同学钱财检讨书范文
2014/11/18 职场文书
武夷山导游词
2015/02/03 职场文书
深度学习详解之初试机器学习
2021/04/14 Python
Django Paginator分页器的使用示例
2021/06/23 Python