使用原生js写ajax
// 使用原生js 封装ajax
// 兼容xhr对象
function createXHR(){
if(typeof XMLHttpRequest != "undefined"){ // 非IE6浏览器
return new XMLHttpRequest();
}else if(typeof ActiveXObject != "undefined"){ // IE6浏览器
var version = [
"MSXML2.XMLHttp.6.0",
"MSXML2.XMLHttp.3.0",
"MSXML2.XMLHttp",
];
for(var i = 0; i < version.length; i++){
try{
return new ActiveXObject(version[i]);
}catch(e){
//跳过
}
}
}else{
throw new Error("您的系统或浏览器不支持XHR对象!");
}
}
// 转义字符
function params(data){
var arr = [];
for(var i in data){
arr.push(encodeURIComponent(i) + "=" + encodeURIComponent(data[i]));
}
return arr.join("&");
}
// 封装ajax
function ga_ajax(obj){
var xhr = createXHR();
obj.url = obj.url + "?rand=" + Math.random(); // 清除缓存
obj.data = params(obj.data); // 转义字符串
if(obj.method === "get"){ // 判断使用的是否是get方式发送
obj.url += obj.url.indexOf("?") == "-1" ? "?" + obj.data : "&" + obj.data;
}
// 异步
if(obj.async === true){
// 异步的时候需要触发onreadystatechange事件
xhr.onreadystatechange = function(){
// 执行完成
if(xhr.readyState == 4){
callBack();
}
}
}
xhr.open(obj.method,obj.url,obj.async); // false是同步 true是异步 // "demo.php?rand="+Math.random()+"&name=ga&ga",
if(obj.method === "post"){
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xhr.send(obj.data);
}else{
xhr.send(null);
}
// xhr.abort(); // 取消异步请求
// 同步
if(obj.async === false){
callBack();
}
// 返回数据
function callBack(){
// 判断是否返回正确
if(xhr.status == 200){
obj.success(xhr.responseText);
}else{
obj.Error("获取数据失败,错误代号为:"+xhr.status+"错误信息为:"+xhr.statusText);
}
}
} var html = document.getElementsByTagName("html")[0];
html.onclick = function(){
ga_ajax({
"method" : "post",
"url" : "dem0o.php",
"data" : {
"name" : "gaga",
"age" : 10000000,
"num" : "12346&598"
},
"success" : function(data){
alert(data);
},
"Error" : function(text){
alert(text);
},
"async" : false
});
}
使用原生js写ajax的更多相关文章
- 原生js写Ajax
//原生js写ajax就像打电话 //打电话分下面4步//1.拿出手机//2.拨号//3.说话//4.挺对方说话 //ajax也分下面4步//1.创建ajax对象//2.连接到服务器//3.发送请求( ...
- 原生JS写Ajax的请求函数
一.JS原生ajax ajax:一种请求数据的方式,不需要刷新整个页面:ajax的技术核心是 XMLHttpRequest 对象:ajax 请求过程:创建 XMLHttpRequest 对象.连接服务 ...
- 原生js写ajax请求(复习)
今天本地想测试一个接口,不想用框架想用js快速完成,突然发现,我居然忘了这个最基本的代码.好吧,只能复习一波. 在框架泛滥的今天,用惯$.ajax(),axios,superAgent等框架的你们,还 ...
- 用原生JavaScript写AJAX
//原生js写ajax就像打电话 //打电话分下面4步//1.拿出手机//2.拨号//3.说话//4.听对方说话 //ajax也分下面4步//1.创建ajax对象//2.连接到服务器//3.发送请求( ...
- 原生JS写的ajax函数
参照JQuery中的ajax功能,用原生JS写了一个ajax,功能相对JQuery要少很多,不过基本功能都有,包括JSONP. 调用的方式分为两种: 1. ajax(url, {}); 2. ajax ...
- 表单验证--通过原生js模仿ajax的异步交互
今天给大家带来个福利,我也是刚刚学习的很实用的一个东西,通过原生js模仿ajax的异步交互. 我的博客只是给那些新手看的大神勿喷,写的不好可留言,请指出. 因为当初自己学的时候一个问题不会找人问,知道 ...
- 原生js中用Ajax进行get传参
原生js中用Ajax进行get传参 案例: <!DOCTYPE html> <html> <head> <meta charset="UTF-8&q ...
- 原生JS封装ajax方法
http://blog.sucaijiayuan.com/article/89 jquery框架的ajax方法固然好用,但是假如某天我们的项目不能引入jquery或项目需求很简单,没有很多交互功能,只 ...
- 原生js实现ajax与jquery的ajax库,及json
这是一篇笔记博客, Ajax: 和服务器进行数据交换(异步) 用js实现复杂的原理:用于发送请求的对象在不同的浏览器中是不同的 同源策略:ajax发送请求的url地址与服务器地址必须是同一域名,协议, ...
随机推荐
- HDU 1052
http://acm.hdu.edu.cn/showproblem.php?pid=1052 田忌赛马本质就是一个贪心 res表示田忌的胜利场次 1.田忌最快马快于王的最快马,两个最快马比,res++ ...
- 求助 WPF ListViewItem样式问题
求助 WPF ListViewItem样式问题 .NET 开发 > Windows Presentation Foundation Вопрос 0 Нужно войти <Style ...
- beta 阶段的 postmortem 报告
part一: 用户数:目前约30人 总结:与当初的预算差不多,首先1.第一次开发软件,经验效率不足,那是很正常的事情.2.用户数量少,因为宣传力度还是比较的少.应该加强软件的推广才行. part二: ...
- JS中offsetLeft,Left,clientLeft的区别(纯转贴)
假设 obj 为某个 HTML 控件. obj.offsetTop 指 obj 相对于版面或由 offsetParent 属性指定的父坐标的计算上侧位置,整型,单位像素. obj.offsetLeft ...
- VIM键盘快捷键映射
http://www.jianshu.com/p/216811be226b
- java访问webservce,保持会话,服务端保存session验证
在进行程序开发的过程中,遇到一个问题,怎么保持会话. 因为一帮进行方法调用很少涉及到即时身份验证的. 例如: 1:客户端登录后服务端保存登录用户信息: 2:客户端持有验证通过key再次请求: 3:服务 ...
- C#使用FtpWebRequest上传文件
System.Net命名空间下的FtpWebRequest类实现了ftp协议的.Net实现. FtpWebRequest.KeepAlive指定在请求完成后服务器是否要马上关闭连接 FtpWebReq ...
- ZOJ 1125 Floating Point Numbers
原题链接 题目大意:给一个16位的数字,表示一个浮点数,按照规则转换成科学计数法表示. 解法:注释比较清楚了,注意浮点运算的四舍五入问题. 参考代码: #include<iostream> ...
- bootStrap-2
全局样式: 1.移除Body的margin声明: 2.设置Body的背景色为白色: 3.为排版设置了基本的字体,字号和行高: 4.设置全局连接颜色,且当连接处于悬浮:hover状态时,才会显示下划线样 ...
- 解决Volley请求网络数据返回的数据乱码
本人可参考http://tieba.baidu.com/p/4039693566 以往一般我们如下写就可以了 StringRequest request=new StringRequest(url, ...