Ajax的重构
Ajax的重构方法:
(1)创建一个单独的JS文件,命名为AjaxRequest.js,并且在该文件中编写重构Ajax所需要的代码。
var net = new Object(); //创建一个全局变量net
//编写构造函数
net.AjaxRequest = function(url,onload,onerror,method,params){
this.req = null;
this.onload = onload;
this.onerror = (onerror) ? onerror : this.defaultError;
this.loadDate(url,method,params);
}
//编写用于初始化XMLHttpRequest对象并指定处理函数,最后发送HTTP请求的方法
net.AjaxRequest.prototype.loadDate = function(url,method,params){
if(!method){
method = "GET";
}
if(window.XMLHttpRequest){
this.req = new XMLHttpRequest();
}else if(window.ActiveXObject){
this.req = new ActiveXObject("Microsoft.XMLHTTP");
}
if(this.req){
try{
var loader = this;
this.req.onreadystatechange = function(){
net.AjaxRequest.onReadyState.call(loader);
}
this.req.open(method,url,true); //建立对服务器的调用
if(method == "POST"){ //如果提交方式为POST
this.req.setRequestHeader("Content-Type",
"application/x-www-form-urlencoded"); //设置请求头
}
this.req.send(params); //发送请求
}catch(err){
this.onerror.call(this);
}
} }
//重构回调函数
net.AjaxRequest.onReadyState = function(){
var req = this.req;
var ready = req.readyState;
if(ready == 4){ //请求完成
if(req.status == 200){ //请求成功
this.onload.call(this);
}else{
this.onerror.call(this);
}
}
}
//重构默认的错误处理函数
net.AjaxRequest.prototype.defaultError = function(){
alert("错误数据\n\n回调状态:"+this.req.readyState+"\n状态:"+this.req.status);
}
(2)在需要应用的Ajax的页面中应用一下的语句包括(1)中创建的JS文件
<script language="javascript" src="AjaxRequest.js"></script>
(3)在应用Ajax的页面中编写错误处理的方法、实例化Ajax对象的方法和回调函数。
<script language="javascript">
/*********************错误处理的方法******************/
function onerror(){
alert("您的操作有误!");
}
/*********************实例化Ajax对象的方法************/
function getInfo(){
var loader = new net.AjaxRequest("getInfo.jsp?nocache="+new Date().getTime(),
deal_getInfo,onerror,"GET");
}
/*********************回调函数************************/
function deal_getInfo(){
document.getElementById("showInfo").innerHTML=this.req.responseText;
}
</script>
Ajax的重构的更多相关文章
- Ajax重构
Ajax重构简介 Ajax的实现主要依赖于XMLHttpRequest对象,但是在调用其进行异步数据传输时,由于XMLHttpRequest对象的实例在处理事件完成后就会被销毁,所以如果不对该对象进行 ...
- JavaScript从入门到精通(附光盘1张):作者:明日科技出版社:清华大学出版社出版时间:2012年09月
本书介绍 一:本书 pdf 获取信息 本书下载:请申请加入本群 (QQ群:668345923), 并联系群主. 本群主有:本书pdf 全文教材 及附带的 光盘内容 二:本书目录介绍 第1篇 基 ...
- Ajax 重构的步骤
Ajax重构大致可以分为以下3三个步骤. 一 创建一个单独的JS文件,名称为AjaxRequest.js,并且在该文件中编写重构Ajax 所需的代码具体代码如下:var net = new Objec ...
- ajax重构XMLHttpRequest
//重构XMLHttpRequestvar net = new Object(); //名字空間對象 net.READY_STATE_UNINITIALIZED = 0; net.READY_STAT ...
- 网站重构-你了解AJAX吗?
AJAX是时下最流行的一种WEB端开发技术,而你真正了解它的一些特性吗?--IT北北报 XMLHTTPRequest(XHR)是目前最常用的技术,它允许异步接收和发送数据,所有的主流浏览器都对它有不错 ...
- 记一次.NET代码重构
好久没写代码了,终于好不容易接到了开发任务,一看时间还挺充足的,我就慢慢整吧,若是遇上赶进度,基本上直接是功能优先,完全不考虑设计.你可以认为我完全没有追求,当身后有鞭子使劲赶的时候,神马设计都是浮云 ...
- 产品前端重构(TypeScript、MVC框架设计)
最近两周完成了对公司某一产品的前端重构,本文记录重构的主要思路及相关的设计内容. 公司期望把某一管理类信息系统从项目代码中抽取.重构为一个可复用的产品.该系统的前端是基于 ExtJs 5 进行构造的, ...
- Ajax基础
1 概要 异步JavaScript和XML(Asynchronous Javascript And XML,Ajax)就是使用js来收发来自web服务器的数据,且无需重载整个页面的技术. 注 :xml ...
- Ajax完整篇(转载)
Ajax 完整教程 第 1 页 Ajax 简介Ajax 由 HTML.JavaScript™ 技术.DHTML 和 DOM 组成,这一杰出的方法可以将笨拙的 Web 界面转化成交互性的 Ajax 应用 ...
随机推荐
- python数据结构之图论
本篇学习笔记内容为图的各项性质.图的表示方法.图ADT的python实现 图(Graph) 是数据结构和算法学中最强大的框架之一(或许没有之一).图几乎可以用来表现所有类型的结构或系统,从交通网络到通 ...
- 清理solaris /var/mail/下的邮件文件
我服务器上/var/mail下的各个用户的邮件日志非常大,占用空间已经有95%了,我想清除掉,是否可以直接删除/var/mail的各个日志??删除后系统是否可以自动生成? 应该可以直接删除/var/m ...
- El表达式对照表
设置 session.getAttribute("date" "date") 取得username的值 (String)session.getValue( ...
- NPM升级
nmp的更新可以使用自身指令即可: npm install npm -g 可以看到从3.10.10升级到了4.0.5 都说npm比node升级的快,现在比起来nodejs的更新速度更快 如果npm官方 ...
- Appium入门(3)__ Appium Server安装
安装Appium 1.下载并安装:https://bitbucket.org/appium/appium.app/downloads/ 2. 系统变量PATH 增加 C:\Program Files ...
- redis使用rdb恢复数据
redis中存在rdb备份和aof备份两种方式. 如果在redis多个节点发生雪崩时,我们往往使用定期冷备rdb或者aof文件,去恢复数据的方式,但往往数据量较大时rdb恢复更加的快速,毕竟aof保存 ...
- linux 拷贝软连接文件
cp -s sourchfile targetfile 这样拷贝软连接文件时,会将其对应指定路径同步修改,即便原来的软连接是相对路径也不会有问题.
- python json 模块
什么是json? json是返回的是字符串格式,把python数据类型列表.字典转换成json字符串格式, 这种格式java php 其他语言都可以认识的字符串,可以跨语言交流. json,用于字符串 ...
- 帝国cms内容关键字自动加链接且设置内容关键字只替换一次
网站上线前先设置一些内部链接对后期的优化排名很有帮助,帝国cms也可以设置文章中的关键字自动加链接,但是要注意一下关键词替换次数,最好是1次. 怎么操作呢?分两步完成 1.帝国cms文章关键字自动加链 ...
- 003-linux命令-文件和目录、查看文件内容-文本处理
文本处理 cat file1|command(sed,grep,awk,) > result.txt 合并一个文件的详细说明文本,并将简介写入一个新文件中 cat file1|command(s ...