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 相关文章推荐
文本框输入时 实现自动提示(像百度、google一样)
Apr 05 Javascript
javascript 使td内容不换行不撑开
Nov 29 Javascript
使用jQuery避免鼠标双击的解决方案
Aug 21 Javascript
正负小数点后两位浮点数实现原理及代码
Sep 06 Javascript
HTML页面登录时的JS验证方法
May 28 Javascript
JavaScript实现自动对页面上敏感词进行屏蔽的方法
Jul 27 Javascript
js闭包引起的事件注册问题介绍
Mar 29 Javascript
为什么我们要做三份 Webpack 配置文件
Sep 18 Javascript
vue3.0 CLI - 2.1 -  component 组件入门教程
Sep 14 Javascript
jquery实现有过渡效果的tab切换
Jul 17 jQuery
vue中使用router全局守卫实现页面拦截的示例
Oct 23 Javascript
如何使用gpu.js改善JavaScript的性能
Dec 01 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
PHP字符串的编码问题的详细介绍
2013/04/27 PHP
浅析php插件 Simple HTML DOM 用DOM方式处理HTML
2013/07/01 PHP
PHP读书笔记_运算符详解
2016/07/01 PHP
如何通过Apache在本地配置多个虚拟主机
2020/07/29 PHP
让Firefox支持event对象实现代码
2009/11/07 Javascript
node.js中的fs.rmdir方法使用说明
2014/12/16 Javascript
js实现商城星星评分的效果
2015/12/29 Javascript
AngularJS实现Model缓存的方式
2016/02/03 Javascript
js 弹出对话框(遮罩)透明,可拖动的简单实例
2016/07/11 Javascript
JavaScript数值千分位格式化的两种简单实现方法
2016/08/01 Javascript
vue.js指令v-model实现方法
2016/12/05 Javascript
BootStrap整体框架之基础布局组件
2016/12/15 Javascript
详谈js中标准for循环与foreach(for in)的区别
2017/11/02 Javascript
自定义PC微信扫码登录样式写法
2017/12/12 Javascript
Angular父子组件通过服务传参的示例方法
2018/10/31 Javascript
vue中$nextTick的用法讲解
2019/01/17 Javascript
VUE实现移动端列表筛选功能
2019/08/23 Javascript
js利用拖放实现添加删除
2020/08/27 Javascript
Vue.js使用axios动态获取response里的data数据操作
2020/09/08 Javascript
python:print格式化输出到文件的实例
2018/05/14 Python
python将list转为matrix的方法
2018/12/12 Python
python通过http下载文件的方法详解
2019/07/26 Python
pytorch中交叉熵损失(nn.CrossEntropyLoss())的计算过程详解
2020/01/02 Python
使用tensorflow实现矩阵分解方式
2020/02/07 Python
纯CSS实现聊天框小尖角、气泡效果
2014/04/04 HTML / CSS
德国50岁以上交友网站:Lebensfreunde
2020/03/18 全球购物
恒华伟业笔试面试题
2015/02/26 面试题
Python面试题:如何用Python来发送邮件
2016/03/15 面试题
骨干教师培训方案
2014/05/06 职场文书
庆祝新中国成立65周年“向国旗敬礼”网上签名寄语
2014/09/27 职场文书
优秀党务工作者先进事迹材料
2014/12/25 职场文书
初中作文评语
2014/12/25 职场文书
2015年学生会部门工作总结
2015/04/21 职场文书
小学见习报告
2015/06/23 职场文书
Python实现学生管理系统并生成exe可执行文件详解流程
2022/01/22 Python
Android 界面一键变灰 深色主题工具类
2022/04/28 Java/Android