封装通用的 ajax, 基于 jQuery。
在前端异步获取数据时候每次都是使用 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。的更多相关文章
- 基于jQuery的ajax对WebApi和OData的封装
基于jQuery的ajax对WebApi和OData的封装 WebApi 的使用带来了一个显著的特点,对type有一定的要求.一般ajax的type无非就是两种,GET和POST.如果用JSONP来跨 ...
- 基于jQuery封装的分页组件(可自定义设置)
jQuery封装的分页组件 前几天做了一个vue的组件分页,而现在需求是jquery的分页,我就根据我自己的需求写了一个.在网上找了很久的基于jquery的分页封装,可是都不是我想要的结果,那么今天我 ...
- 不借助jquery封装好的ajax,你能用js手写ajax框架吗
不借助jquery封装好的ajax,你能手写ajax框架吗?最基础的ajax框架,一起来围观吧. .创建XMLHttpRequest对象 var xhr = new XMLHttpRequest(); ...
- 基于Jquery+Ajax+Json+高效分页
摘要 分页我相信大家存储过程分页已经很熟悉了,ajax更是耳熟能详了,更别说我们的json,等等. 如果说您没用过这些东东的话,我相信看完这篇博文会对您有帮助的,,如果有任何问题不懂或者有bug没问题 ...
- 源码来袭!!!基于jquery的ajax分页插件(demo+源码)
前几天打开自己的博客园主页,无意间发现自己的园龄竟然有4年之久了.可是看自己的博客列表却是空空如也,其实之前也有写过,但是一直没发布(然而好像并没有什么卵用).刚开始学习编程时就接触到博客园,且在博客 ...
- 基于jQuery封装的分页组件
前言: 由于项目需要实现分页效果,上jQuery插件库找了下,但是木有找到自己想要的效果,于是自己封装了个分页组件. 思路: 主要是初始化时基于原型建立的分页模板然后绑定动态事件并实现刷新DOM的分页 ...
- 基于Jquery+Ajax+Json+存储过程 高效分页
在做后台开发中,都会有大量的列表展示,下面给大家给大家分享一套基于Jquery+Ajax+Json+存储过程高效分页列表,只需要传递几个参数即可.当然代码也有改进的地方,如果大家有更好的方法,愿留下宝 ...
- 基于jQuery实现的Ajax 验证用户名唯一性
基于jQuery实现的Ajax 验证用户名唯一性 前端jsp页面代码 <tr> <th><span class="requiredField"> ...
- 基于jquery ajax的多文件上传进度条
效果图 前端代码,基于jquery <!DOCTYPE html> <html> <head> <title>主页</title> < ...
随机推荐
- CentOS7编译安装sshpass过程
环境说明:centos 7 cat /etc/redhat-release CentOS Linux release 7.6.1810 (Core) 我的sshpass版本 sshpass-1.06. ...
- 虚拟机上首次安装Ubuntu后 root密码设置
虚拟机下安装ubuntu后root密码设置 问题描述: 在虚拟机下安装了ubuntu中要输入用户名,一般情况下大家都会输入一个自己的网名或绰号之类的,密码也在这时设置过了. 但是当安装成功之后,使用命 ...
- 全新一台node节点加入到集群中
目录 前言 对新节点做解析 方法一 hosts 文件解析 方法二 bind 解析 测试 分发密钥对 推送 CA 证书 flanneld 部署 推送flanneld二进制命令 推送flanneld秘钥 ...
- 部署CM集群首次运行报错:Formatting the name directories of the current NameNode.
1. 报错提示 Formatting the name directories of the current NameNode. If the name directories are not emp ...
- 你知道 Java 类是如何被加载的吗?
前言 最近给一个非 Java 方向的朋友讲了下双亲委派模型,朋友让我写篇文章深度研究下JVM 的 ClassLoader,我确实也好久没写 JVM 相关的文章了,有点手痒痒,涂了皮炎平也抑制不住的那种 ...
- Linux文件拷贝(6)
本篇介绍文件拷贝操作,主要讲两个命令: 命令 对应英文 作用 tree[目录名] tree 以树状图列出文件目录结构 cp 源文件 目标文件 copy 复制文件或者目录 tree tree命令可以将一 ...
- windows上zeal安装和使用--离线API文档
1.官网:https://zealdocs.org/download.html#windows 2.github:https://github.com/zealdocs/zeal 3.下载:可下载安装 ...
- Python win32com模块 合并文件夹内多个docx文件为一个docx
Python win32com模块 合并文件夹内多个docx文件为一个docx #!/usr/bin/env python # -*- coding: utf-8 -*- from win32com. ...
- 01分数规划问题(二分法与Dinkelbach算法)
链接 前置技能 二分思想 最短路算法 一些数学脑细胞? 问题模型1基本01分数规划问题给定n个二元组(valuei,costi),valuei是选择此二元组获得的价值(非负),costi是选择此二元组 ...
- 流畅的Python (Fluent Python) —— 第一部分
Python 最好的品质之一是一致性. 魔术方法(magic method)是特殊方法的昵称.特殊方法也叫双下方法. 1.1 一摞Python风格的纸牌 import collections Card ...