ajax的封装
ajax是前端工程中与后台进行数据交互的一门重要技术,通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。jquery中对ajax进行了封装,可以直接使用.下面是自己封装的一个ajax的js文件,感兴趣的朋友可以下载使用,
以下封装的ajax代码,可以帮助大家了解ajax的整个操作过程,告诉大家ajax是如何进行交互的.
function AJAX(obj){ //做网络请求的时候 ,参数以对象的形式传递进来
//规定:obj里面包含属性:1.url
//2.type --- get 还是 post
//3.data --- 前端给后端传递的参数(前端传递的时候以对象的形式)
//4.回调函数 --- success
//5.回调函数 --- error
var ajaxObj = null;
if (window.XMLHttpRequest) {
ajaxObj = new XMLHttpRe.quest();
}else{
ajaxObj = new ActiveXObject("Microsoft.XMLHTTP");
}
ajaxObj.onreadystatechange = function(){
if (ajaxObj.readyState == 4) {
if (ajaxObj.status >= 200 && ajaxObj.status < 300 || ajaxObj.status == 304) {
if (obj.success) {
obj.success(JSON.parse(ajaxObj.responseText));
}else{
alert("您忘记了success函数");
}
}else{
if (obj.error) {
0obj.error(ajaxObj.status);
}else{
alert("您忘记了error函数");
}
}
}
}
//type转化为小写,方便使用
var type = obj.type || "get";
type = type.toLowerCase();
//判断是否传递了参数
var params = "";
if (obj.data) {
for(var key in obj.data){
params += (key + "=" + obj.data[key] + "&");
}
params=params.slice(0,params.length-1);
}
if (type == "get") {
ajaxObj.open(type,obj.url+"?"+params,true);
ajaxObj.send();
}else{
ajaxObj.open(type,obj.url,true);
ajaxObj.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
ajaxObj.send(params);
}
}
//欢迎大家提出改进建议
ajax的封装的更多相关文章
- 原生态AJAX详解和jquery对AJAX的封装
AJAX: A :Asynchronous [eI`sinkrenes] 异步 J :JavaScript JavaScript脚本语言 A: And X :XML 可扩展标记语言 AJAX现在 ...
- 【前端学习笔记04】JavaScript数据通信Ajax方法封装
//Ajax 方法封装 //设置数据格式 function setData(data){ if(!data){ return ''; } else{ var arr = []; for(k in da ...
- 原生ajax与封装的ajax使用方法
当我们不会写后端接口来测试ajax时,我们可以使用node环境创建一个本地服务器. 1.创建一个本地服务器可参考http://www.cnblogs.com/heyujun-/p/6793900.ht ...
- Ajax入门(二)Ajax函数封装
如果看了的我上一篇博客<Ajax入门(一)从0开始到一次成功的GET请求>的话,肯定知道我们已经完成了一个简单的get请求函数了.如下: 1234567891011121314151617 ...
- js进阶ajax函数封装(匿名函数作为参数传递)(封装函数引入文件的方式非常好用)
js进阶ajax函数封装(匿名函数作为参数传递)(封装函数引入文件的方式非常好用) 一.总结 2.匿名函数作为参数传递 二.js进阶ajax函数封装 ajax1.js function ajax(ur ...
- jQuery-实现简单的Ajax请求封装
封装的意义在于复用,在于减少重复的代码. 我在项目中做了简单的Ajax请求封装,实现方式如下: //封装Ajax请求 $.extend({ ajaxDirect:function(url,type,d ...
- JQ中的Ajax的封装
1.认识JQ中ajax的封装 jQ 对于ajax的封装有两层实现:$.ajax 为底层封装实现:基于 $.ajax ,分别实现了$.get 与$.post 的高层封装实现: 2.Ajax的底 ...
- Ajax的封装。
封装 Ajax 因为Ajax 使用起来比较麻烦,主要就是参数问题,比如到底使用GET 还是POST:到 底是使用同步还是异步等等,我们需要封装一个Ajax 函数,来方便我们调用. 封装支持接收来 ...
- Jquery Ajax简单封装(集中错误、请求loading处理)
Jquery Ajax简单封装(集中错误.请求loading处理) 对Jquery Ajax做了简单封装,错误处理,请求loading等,运用到项目中集中处理会很方便. 技术层面没有什么好说的,请求是 ...
- Ajax的封装,以及利用jquery的ajax获取天气预报
1.Ajax的封装 function ajax(type,url,param,sync,datetype,callback){//第一个参数是获取数据的类型,第二个参数是传入open的url,第三个是 ...
随机推荐
- windows 查看端口被占用
C:\Users\xxxx> 根据端口找到进程14716 C:\Users\xxxx>tasklist|findstr "14716"node.exe 14716 Co ...
- [Qt] fontawesome图标
fontawesome图标 fontawesome是一个图标的集合,里面有好多的图标,使用起来也还是非常方便的. 图标信息可以到官网去查:http://fontawesome.io/cheatshee ...
- (转)iOS Wow体验 - 第六章 - 交互模型与创新的产品概念(2)
本文是<iOS Wow Factor:Apps and UX Design Techniques for iPhone and iPad>第六章译文精选的第二部分,其余章节将陆续放出.上一 ...
- Zedboard甲诊opencv图像处理(二)
通过前面的努力已经得到了n个轮廓了,现在要把最终的轮廓确定下来 ,然后进行特征提取. 先深入分析下轮廓和处理轮廓的方法:http://blog.csdn.net/hitwengqi/article/d ...
- VMware vSphere 5.5的12个更新亮点(3)
端口镜像 有时有必要捕捉网络中的数据包来追踪问题.最新版本的vSphere包括一个增强版的开源数据包分析器tcpdump和一些镜像端口的选项以捕捉各种场所的流量.您可以捕获虚拟网卡,虚拟交换机,以及主 ...
- AIX 7.1 安装 Python2.7.5
一.下载必要的安装包 1. gdbm-1.8.3-5.aix5.2.ppc.rpm 下载地址:ftp://ftp.software.ibm.com/aix/freeSoftware/aixtoolb ...
- 理清fineuploader无刷新上传的一些事
1.fineuploader是一款不依赖与jquery的异步无刷新上传组件,fineuploader采用ajax方式实现对文件上传,返回值都是以json的格式,对后台服务器操作和前端dom对象一些操作 ...
- Asp.net原理(第一篇)
Asp.net (第一篇) 当用户在浏览器输入一个URL地址后,浏览器会发送一个请求到服务器.这时候在服务器上第一个负责处理请求的是IIS.然后IIS再根据请求的URL扩展名将请求分发给不同的ISAP ...
- (转)Ajax的原理和应用
1.ajax技术的背景 不可否认,ajax技术的流行得益于google的大力推广,正是由于google earth.google suggest以及gmail等对ajax技术的广泛应用,催生了ajax ...
- LinkedList : 双向链表与实现
所谓双向链表: (由此图可见老夫深厚的画功) 链表,就是由一个一个的节点连接组成. 在这里,每一个节点都是由三部分组成:上一个节点.当前节点的元素.下一个节点 当链表中只有一个节点的时候,这个节点指向 ...