原生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 ...
随机推荐
- 数据库和java Bean
·1. 数据库和java Bean,字段类型要一致.不一致查询不出来,但不会报错. 字段名称也一样,不一致查询不出来,但不会报错. 2. 数据库和java Bean字段的个数可以不一样,也不会包错 3 ...
- Windows下安装配置PLSQL
说明:1.PLSQL Developer是远程连接Oracle数据库的一个可视化工具,并且其不是一个独立的软件,是需要依赖Oracle客户端运行的.2.本安装教程是基于本机没有安装Oracle数据库的 ...
- Crane /// 向量旋转+线段树
题目大意: 给定n条首尾相接的线段的长度 第一条从0,0开始,所有线段垂直与x轴向上延伸 给定c次操作 每次操作给定 s,a 使得 由第s条线段的角度 逆时针旋转a后 达到第s+1条线段的角度 每次操 ...
- leetcode 题型 数据结构 解法 分类总结
第2章 线性表 2.1 数组 2.1.1 Remove Duplicates from Sorted Array 2.1.2 Remove Duplicates from Sorted Array I ...
- jdbc出现中文乱码的解决办法
- VBA当中的时间日期函数
目前还没发现VBA中有直接的函数能够将完整的年月日时分秒的文本格式日期转换成日期型日期的,那只能使用间接实现的办法.用dateserial + timeserial的方法.因为dateserial和t ...
- 数据库MySQL--基础查询
1.查询字段 查询表某字段:select 字段名 from 表名: 查询表内所有字段:select * from 表名: (当字段和关键字重名是用( ` )着重号区分 ) 2.查询常量值 select ...
- BCZM : 1.4
书店促销活动,某套书一共有五卷.假设每一卷单独销售均需8欧元,多买则有折扣,具体折扣如下: 2 5% 3 10% 4 20% 5 25% 设计算法,计算出读者购买一批书的 ...
- H5点击拨打电话,发短信
phone(){ window.location.href = 'tel:123123'// 拨打电话 window.location.href = 'sms:123123'// 发短信 }
- Python自学:第四章 在for循环中执行更多操作(1)
# -*- coding: GBK -*- magicians = ['alice', 'david', 'carolina'] for magician in magicians: print(ma ...