在前端异步获取数据时候每次都是使用 ajax;为了通用性更好,然而封装通用的 ajax 是一个一劳永逸的办法。

本次基于 jQuery 封装实现;

第一步: 引入 jQuery:

<script type="text/javascript" src="<%=path%>/resources/js/jquery.min.js"></script>

第二步:实现代码:

// 该封装基于 jQuery

var sendAjax = function(method, url, data, successfn, errorfn) {
$.ajax({
type: method,
url: url,
data: data,
success: function(d){
successfn(d);
},
error: function(e){
errorfn(e);
}
});
} // 注意:
// 1.1 data 数据格式根据需求处理
// 1.2 successfn 和 errorfn 根据需要自行定义 // 例如: var __main = function() {
// 请求方法
var method = 'GET' // 请求地址
var url = 'main/test' // 数据格式处理
var datas = {name: 'zhangsan', age: '25'}
var data = JSON.stringify(datas) // 成功调用函数
var demoSuccessfn = function(testSuccess) {
if(testSuccess === 'success') {
console.log('success')
} else {
console.log('reponse have some question.')
}
} // 失败调用函数
var demoErrorfn = function(testError) {
if(testError === 'error') {
console.log('error')
} else {
console.log('have error information.')
}
} // 实现调用 sendAjax(method, url, data, successfn, errorfn)
}

封装通用的 ajax, 基于 jQuery。的更多相关文章

  1. 基于jQuery的ajax对WebApi和OData的封装

    基于jQuery的ajax对WebApi和OData的封装 WebApi 的使用带来了一个显著的特点,对type有一定的要求.一般ajax的type无非就是两种,GET和POST.如果用JSONP来跨 ...

  2. 基于jQuery封装的分页组件(可自定义设置)

    jQuery封装的分页组件 前几天做了一个vue的组件分页,而现在需求是jquery的分页,我就根据我自己的需求写了一个.在网上找了很久的基于jquery的分页封装,可是都不是我想要的结果,那么今天我 ...

  3. 不借助jquery封装好的ajax,你能用js手写ajax框架吗

    不借助jquery封装好的ajax,你能手写ajax框架吗?最基础的ajax框架,一起来围观吧. .创建XMLHttpRequest对象 var xhr = new XMLHttpRequest(); ...

  4. 基于Jquery+Ajax+Json+高效分页

    摘要 分页我相信大家存储过程分页已经很熟悉了,ajax更是耳熟能详了,更别说我们的json,等等. 如果说您没用过这些东东的话,我相信看完这篇博文会对您有帮助的,,如果有任何问题不懂或者有bug没问题 ...

  5. 源码来袭!!!基于jquery的ajax分页插件(demo+源码)

    前几天打开自己的博客园主页,无意间发现自己的园龄竟然有4年之久了.可是看自己的博客列表却是空空如也,其实之前也有写过,但是一直没发布(然而好像并没有什么卵用).刚开始学习编程时就接触到博客园,且在博客 ...

  6. 基于jQuery封装的分页组件

    前言: 由于项目需要实现分页效果,上jQuery插件库找了下,但是木有找到自己想要的效果,于是自己封装了个分页组件. 思路: 主要是初始化时基于原型建立的分页模板然后绑定动态事件并实现刷新DOM的分页 ...

  7. 基于Jquery+Ajax+Json+存储过程 高效分页

    在做后台开发中,都会有大量的列表展示,下面给大家给大家分享一套基于Jquery+Ajax+Json+存储过程高效分页列表,只需要传递几个参数即可.当然代码也有改进的地方,如果大家有更好的方法,愿留下宝 ...

  8. 基于jQuery实现的Ajax 验证用户名唯一性

    基于jQuery实现的Ajax 验证用户名唯一性 前端jsp页面代码 <tr> <th><span class="requiredField"> ...

  9. 基于jquery ajax的多文件上传进度条

    效果图 前端代码,基于jquery <!DOCTYPE html> <html> <head> <title>主页</title> < ...

随机推荐

  1. [转帖]挖洞经验 | 获取Facebook Marketplace卖家精确地理位置信息

    挖洞经验 | 获取Facebook Marketplace卖家精确地理位置信息 https://www.freebuf.com/vuls/202820.html 知识就是力量 5000刀的一个漏洞. ...

  2. java8----Predicate接口的使用

    //5.lambda表达式中加入Predicate // 甚至可以用and().or()和xor()逻辑函数来合并Predicate, // 例如要找到所有以J开始,长度为四个字母的名字,你可以合并两 ...

  3. 1、Java语言概述与开发环境——Java程序运行机制

    Java语言是一种特殊的高级语言,它既有解释型语言的特性,也具有编译型语言的特征,因为Java要经过先编译后解释两个步骤. 一.高级语言的运行机制 计算机高级语言按程序的执行方式可以分为编译型和解释型 ...

  4. IntelliJ IDEA中创建Web聚合项目(Maven多模块项目)(转载)

    创建parent项目 1.打开IDEA,注意这里不要勾选模板,用模板创建过maven项目的小伙伴都知道模板创建项目非常慢,所以这里不要选模板,需要的文件夹我们后面自己来创建就可以了.所以这个页面直接点 ...

  5. 基于 Redux + Redux Persist 进行状态管理的 Flutter 应用示例

    好久没在 SegmentFault 写东西,唉,也不知道 是忙还是懒,以后有时间 再慢慢写起来吧,最近开始学点新东西,有的写了,个人博客跟这里同步. 一直都在自己的 React Native 应用中使 ...

  6. 手摸手教你如何在 Python 编码中做到小细节大优化

    手摸手教你如何在 Python 编码中做到小细节大优化 在列表里计数 """ 在列表里计数,使用 Python 原生函数计数要快很多,所以尽量使用原生函数来计算. &qu ...

  7. listalias - 列出用户和系统别名

    总揽 listalias [ -s | -u ] [ 正则表达式] 描述 Listalias 按用户及系统别名每个输出一行.每行具有下列格式: <别名> <地址> (<注 ...

  8. 企业网站的SSL签证生产测试以及https配置方法

    这一次要做企业网站怎么获得安全的数字证书,没有数字证书的话,在浏览器访问网站的时候会跳出不安全界面,而且钓鱼网站也会让用户进去个假网站,一般企业可以去阿里云去买数字证书,买好之后浏览器便会加载这个数字 ...

  9. Django扩展内置User类

    内置User类 使用内置User可以方便实现登录验证,利用Admin管理界面还可以方便添加.删除.修改用户. 一个内置的User类定义了以下字段: username: 用户名 password: 密码 ...

  10. 软件包管理(rpm、yum、dpkg)

    一. 大多数Linux应用软件包的命名也有一定的规律,它遵循:名称-版本-修正版-类型,通常Linux应用软件的安装包有三种: 1) tar包,如software-1.2.3-1.tar.gz.以源码 ...