原生ajax封装及用法
/* 封装ajax函数
* @param {string}opt.type http连接的方式,包括POST和GET两种方式
* @param {string}opt.url 发送请求的url
* @param {boolean}opt.async 是否为异步请求,true为异步的,false为同步的
* @param {object}opt.data 发送的参数,格式为对象类型
* @param {function}opt.success ajax发送并接收成功调用的回调函数
*/
function ajax(opt) {
opt = opt || {};
opt.method = opt.method.toUpperCase() || 'POST';
opt.url = opt.url || '';
opt.async = opt.async || true;
opt.data = opt.data || null;
opt.success = opt.success || function () {};
var xmlHttp = null;
if (XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
else {
xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');
}
// xmlHttp.withCredentials = true; // 携带跨域cookie
var params = [];
for (var key in opt.data){
params.push(key + '=' + opt.data[key]);
}
var postData = params.join('&');
if (opt.method.toUpperCase() === 'POST') {
xmlHttp.open(opt.method, opt.url, opt.async);
xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded;charset=utf-8');
xmlHttp.send(postData);
}
else if (opt.method.toUpperCase() === 'GET') {
xmlHttp.open(opt.method, opt.url + '?' + postData, opt.async);
xmlHttp.send(null);
}
xmlHttp.onreadystatechange = function () {
if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
opt.success(xmlHttp.responseText);
}
};
}
ajax({
method: 'GET',
url: 'http://cdn.aiclk.com/game/dice/dice.html?iclicashid=7664017&&gameTimes=8&&iclicashsid=&&redpack=1&&appShow=0&&back=0',
data: {},
success: function (response) {
console.log(response);
}
});
原生ajax封装及用法的更多相关文章
- 原生ajax封装,包含post、method方式
原生ajax封装,包含post.method方式 function ajax(method, url, data, success) { var xhr = null; try { xhr = new ...
- 浅谈AJAX的基本原理和原生AJAX的基础用法
一.什么是AJAX? AJAX,即"Asynchronous Javascript And XML",翻译为异步的JavaScript和XML,是一种创建交互式网页应用的网页开发技 ...
- 原生 Ajax 封装 和 Axios 二次 封装
AJAX 异步的JavaScript与XML技术( Asynchronous JavaScript and XML ) Ajax 不需要任何浏览器插件,能在不更新整个页面的前提下维护数据,但需要用户允 ...
- 原生AJAX封装
var ajaxHelper = { /*1.0 浏览器兼容的方式创建异步对象*/ makeXHR: function () { //声明异步对象变量 var xmlHttp = false; //声 ...
- 原生Ajax封装随笔
XMLHttpRequest 对象用于和服务器交换数据.我们使用 XMLHttpRequest 对象的 open() 和 send() 方法: open(method,url,async) metho ...
- 原生ajax封装,数据初始化,
var ajaxTool = { setting : { method : 'get', url : location.href, data : '', callback : function(){a ...
- 原生js封装ajax:传json,str,excel文件上传表单提交
由于项目中需要在提交ajax前设置header信息,jquery的ajax实现不了,我们自己封装几个常用的ajax方法. jQuery的ajax普通封装 var ajaxFn = function(u ...
- 原生JS封装Ajax插件(同域&&jsonp跨域)
抛出一个问题,其实所谓的熟悉原生JS,怎样的程度才是熟悉呢? 最近都在做原生JS熟悉的练习... 用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的...简单说说思路,如有不正 ...
- 原生javascript封装ajax和jsonp
在我们请求数据时,完成页面跨域,利用原生JS封装的ajax和jsonp: <!DOCTYPE html> <html lang="en"> <head ...
随机推荐
- 剑指offer——31序列化二叉树
题目描述 请实现两个函数,分别用来序列化和反序列化二叉树 二叉树的序列化是指:把一棵二叉树按照某种遍历方式的结果以某种格式保存为字符串,从而使得内存中建立起来的二叉树可以持久保存.序列化可以基于先 ...
- python array基本操作一
一.排序 a = [2,3,4,1] b = np.argsort(a) # out:[3 0 1 2] # 输出:是一个数组,是按元素递增顺序的索引 二.查找 1.最大值及其索引 b = max(a ...
- spark集群进入 bin 下面目录./spark-shell 出现Unable to load native-hadoop library for your platform... using builtin-java classes where applicable
spark集群启动的时候可以正常,进入 ./spark-shell 就会出现如下错误 配置文件:spark-env.sh export JAVA_HOME=/usr/java/jdk1.7.0_51e ...
- sklearn中pipeline的用法和FeatureUnion
一.pipeline的用法 pipeline可以用于把多个estimators级联成一个estimator,这么 做的原因是考虑了数据处理过程中一系列前后相继的固定流程,比如feature selec ...
- ionic 滚动条 ion-scroll 用于创建一个可滚动的容器
ionic 滚动条 ion-scroll ion-scroll 用于创建一个可滚动的容器. 用法 <ion-scroll [delegate-handle=""] [dire ...
- webstorm安装与破解
1.下载webstorm和补丁文件 链接:https://pan.baidu.com/s/1aiHxPExAbDCcHxKtB82_vg 提取码:jo07 链接:https://pan.baidu.c ...
- Vim模糊查找与替换
例如要把 ( 1 ).( 2 ) - 全部替换成其他字符,可以用命令: :%s/(.*)/str/gn 其中,.* 表示匹配任何东西,如果只希望匹配应为字母和数字,可以用 \w\+. 有些特殊字符需要 ...
- 【JZOJ6277】矩阵游戏
description analysis 设所有操作之后,\(f[i]\)表示\(i\)行乘的数,\(g[j]\)表示\(j\)列乘的数,那么 \[Answer=\sum^{n}_{i=1}\sum^ ...
- Windows ping
用法: ping [-t] [-a] [-n count] [-l size] [-f] [-i TTL] [-v TOS] [-r count] [-s count] [[-j ...
- R语言 数据重塑
R语言数据重塑 R语言中的数据重塑是关于改变数据被组织成行和列的方式. 大多数时间R语言中的数据处理是通过将输入数据作为数据帧来完成的. 很容易从数据帧的行和列中提取数据,但是在某些情况下,我们需要的 ...