ajax请求封装函数
- 写封装函数的套路
1.先写出这个函数原来的基本用法
2.写一个没有形参空函数,将上一步的代码直接作为函数体,
3.根据使用过程中,抽象出来需要变的东西作为形参
function ajax (method, url, params, fun) {
method = method.toUpperCase() //在传入method的时候可以忽略大小写
var xhr = new XMLHttpRequest()
if (typeof params === 'object') { //如果在地址传入的东西是一个对象,我们将它的格式转化为urlencoded
var tempArr = []
for (var key in params) {
var value = params[key]
tempArr.push(key + '=' + value)
}
params = tempArr.join('&') //===>这里的格式就为parsms=[key1=value&key2=value2]
}
if (method === 'GET') {
url += '?' + params
}
xhr.open(method, url, false)
var data = null
if (method === 'POST') { //如果请求的方式为POST,需要手动设置请求头的Content-Type
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded')
data = params
}
xhr.onreadystatechange = function () {
if (this.readyState !== 4) return
// console.log(this.responseText) //这里可以得到响应体,但是后面要处理的内容应该根据使用者的需要来处理
fun(this.responseText)
}
xhr.send(data)
}
// 调用者
// ============================
var fun = function (res) {
console.log(res);
}
ajax('get', 'test.php', {}, fun)
ajax请求封装函数的更多相关文章
- jQuery-实现简单的Ajax请求封装
封装的意义在于复用,在于减少重复的代码. 我在项目中做了简单的Ajax请求封装,实现方式如下: //封装Ajax请求 $.extend({ ajaxDirect:function(url,type,d ...
- ajax请求,函数外无法获取请求的数据问题解决
一.开发中遇到需要通过ajax请求获取其他函数能否执行的状态,但是当赋值给statusFlag时发现无法赋值:ajax请求默认为异步的方式,该请求的操作被放置在任务队列中,并不会按顺序执行,所以被赋值 ...
- Ajax请求回调函数没有被调用
$.ajax({ type:"post", url:"http://172.16.41.91:8080/FcsServletSSM/users ...
- ajax请求封装的公共方法
/** * post 方法 */ function ajaxPost(url, params, callBack) { ajax(url,params,"post",callBac ...
- React后台管理系统-ajax请求封装
1.新建文件夹 util , 在util里边新建 mm.jsx文件 2.使用jquery里边的ajax发送请求,回调用promise,返回一个promise对象 request(param){ ...
- ajax请求封装
var xmlHttp; var ajaxRequest = function (params) { xmlHttp ={}; this.url = params.url; this.method = ...
- 为非ajax请求绑定回调函数的方法
我们都知道jQuery为ajax请求封装了success和error两个回调方法,其实jQuery也实现了为非ajax请求的普通方法也设计了绑定回调函数的方法. 当一个方法需要等待另一个耗时很长的方法 ...
- 原生AJAX请求教程
ajax 即 Asynchronous Javascript And XML,AJAX 不是一门的新的语言,而是对现有持术的综合利用.本质是在 HTTP 协议的基础上以异步的方式与服务器进行通信. 异 ...
- 前后台交互ajax请求模块
下载依赖包axios npm i axios -d //在packge.json内配置proxy,配置请求基础路径 "proxy":"http://localhost:5 ...
随机推荐
- C-Lodop设置页面一加载就打印
C-Lodop由于是服务不是np插件,调用打印语句(print或preview等)时机太早,在页面第一次加载完成后有几百毫秒时间等待WebSocket通讯服务准备完成,在没完成的时候会提示“C-Lod ...
- Windows Server 2012 添加角色时出现 failed to open runspace pool
先把所有的Windows Server 2012的更新更新了.再来添加服务器角色.就不会再出现 The Server Manager WinRM plug-in might be corrupted ...
- 文件上传.ashx
using System;using System.Collections.Generic;using System.IO;using System.Linq;using System.Runtime ...
- HDU1251 字典树板子题
题意:中文题,统计以某字符串作为前缀的字符串个数 刚学字典树,理解起来十分简单,就是维护一个多叉树,这里用的是链表版本,后面就用的是数组版本了,个人更喜欢数组版本,这里的链表版本就因为 莫名其妙的错误 ...
- Snowflake Snow Snowflakes POJ - 3349 Hash
题意:一个雪花有六个角 给出N个雪花 判断有没有相同的(可以随意旋转) 参考:https://blog.csdn.net/alongela/article/details/8245005 注意:参考 ...
- IDEA中Maven项目使用Junit4单元测试的写法
IDEA默认是安装了junit控件的,直接使用就好了 在maven项目的pom.xml文件中添加依赖 <dependency> <groupId>junit</group ...
- wstngfw openVpn站点到站点连接示例(共享密钥)
wstngfw openVpn站点到站点连接示例(共享密钥) 在本例中,将假设以下设置: 站点 A 站点 B 名称 Beijing Office(北京办公室) 名称 Shenzheng Office( ...
- wstngfw IPsec 站点到站点连接示例
wstngfw IPsec 站点到站点连接示例 在本例中,将假设以下设置: IPsec站点设置 站点 A 站点 B 名称 Beijing Office(北京办公室) 名称 Shenzheng Offi ...
- NOIP2018联赛总结
NOIP2018联赛总结 Day 0 打了几个模板,看了一下别人的博客,背了一下vimrc Day 1 到了考场,先把vimrc配好 打开题目一先把三道题瞄了一眼,\(T1\)似乎是NOIP原题,\( ...
- 【BZOJ4005】[JLOI2015] 骗我呢(容斥,组合计数)
[BZOJ4005][JLOI2015] 骗我呢(容斥,组合计数) 题面 BZOJ 洛谷 题解 lalaxu #include<iostream> using namespace std; ...