Ajax重构大致可以分为以下3三个步骤。

一 创建一个单独的JS文件,名称为AjaxRequest.js,并且在该文件中编写重构Ajax 所需的代码
具体代码如下:
var net = new Object();  // 定义一个全局的变量
// 编写构造函数
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)   // 设置默认的请求方式为GET
         {
        method =“GET”;                                                          
         }
         if(window.XMLHttpRequest)
         {                                                // 非IE 浏览器
        this.req = newXMLHttpRequest();   // 创建XMLHttpRequest 对象                                       
         } 
         elseif(window.ActiveXObject)
         {                                     // IE 浏览器
       try
       {
                this.req= new ActiveXObject(“Microsoft.XMLHTTP”);    // 创建XMLHttpRequest 对象
        } 
        catch(e)
        {
             try
             {
                      this.req = new ActiveXObject(“Msxml2.XMLHTTP”); // 创建XMLHttpRequest 对象
             } 
             catch(e)
             {
             }
         }
         }
         if(this.req)
         {
        try
        {
                 varloader = 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.setRequestHeader(“x-requested-with”,“ajax”);   // 设置请求的发出者
                }
                 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);
}
二 在需要应用Ajax 的页面中应用以下的语句包括步骤一中创建的JS 文件
<script language =“javascript”src =“AjaxRequest.js”> </script>
 
三 在应用Ajax 的页面中编写错误处理的方法,实例化Ajax 对象的方法和回调函数
具体代码如下:
<script language =“javascript”>
/ ****************** 错误处理的方法************************************** /
function onerror()
{
         alert(“ 您的操作有误!”);
}
/ ****************** 实例化Ajax 对象的方法*********************** ****** /
function getInfo()
{
         var loader = newnet.AjaxRequest(“getInfo.jsp?nocache =”+ new Date().getTime(),deal_getInfo,onerror,“GET”);
}
/ ************************ 回调函数*********************** *************** /
function deal_getInfo()
{
         document.getElementById(“showInfo”).innerHTML= this.req.responseText;
}
</ script>

Ajax 重构的步骤的更多相关文章

  1. Ajax重构

    Ajax重构简介 Ajax的实现主要依赖于XMLHttpRequest对象,但是在调用其进行异步数据传输时,由于XMLHttpRequest对象的实例在处理事件完成后就会被销毁,所以如果不对该对象进行 ...

  2. 实现AJAX的基本步骤

    实现AJAX的基本步骤 要完整实现一个AJAX异步调用和局部刷新,通常需要以下几个步骤: (1)创建XMLHttpRequest对象,也就是创建一个异步调用对象. (2)创建一个新的HTTP请求,并指 ...

  3. 实现AJAX的基本步骤 。。转

    要完整实现一个AJAX异步调用和局部刷新,通常需要以下几个步骤: (1)创建XMLHttpRequest对象,也就是创建一个异步调用对象. (2)创建一个新的HTTP请求,并指定该HTTP请求的方法. ...

  4. ajax的请求步骤!每个状态值表示什么?

    什么是是ajax ! AJAX即"Asynchronous JavaScript and XML"(异步的JavaScript与XML技术),指的是一套综合了多项技术的浏览器端网页 ...

  5. 简述 AJAX 及基本步骤

    简述 AJAX:AJAX即“Asynchronous Javascript And XML”(异步 JavaScript 和 XML),是指一种创建交互式网页应用的网页开发技术.通过在后台与服务器进行 ...

  6. ajax重构XMLHttpRequest

    //重构XMLHttpRequestvar net = new Object(); //名字空間對象 net.READY_STATE_UNINITIALIZED = 0; net.READY_STAT ...

  7. $.getJSON 返回值、AJAX异步调用步骤

    //首先要判断用户录入的手机号是不是中国移动的,不是直接给出提示,并终止登录 if($("#cmUsername1").val().isMobile())//手机号码 { jQue ...

  8. javascript中ajax的四大步骤

    原生js中ajax写法一: function ajaxys(){ //1. 创建xhr对象 var xhr = new XMLHttpRequest();//XMLHttpRequest() // 2 ...

  9. ajax的五大步骤

    什么是Ajax? AJAX 是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下. var btn = document.getElementsByTagName('button')[ ...

随机推荐

  1. [转] 配置文件解析利器-Config库

    [From] https://blog.csdn.net/zero__007/article/details/51493851 Typesafe的Config库,纯Java写成.零外部依赖.代码精简. ...

  2. 详解Oracle hints PQ_DISTRIBUTE

    PQ_DISTRIBUTE是并行的hints中稍微复杂一点的一个 下面就这个hints做以下说明: 1.使用格式 /+ PQ_DISTRIBUTE(tablespec outer_distributi ...

  3. 神马是代码简单的cmd模式,这就是!

    小狼正在研究 “怎么查找连在一起的同色方块?”算法问题 ,突然感觉我是不是需要一种开发模式,不然感觉自己的代码好乱的. 可能是研究算法吧,导致小狼的思路特别清晰,加上也用了差不多1年的nodejs.s ...

  4. pyspider的基本操作

    一.安装 pip install pyspider 1.修改 pyspider/webui/webdav.py 第209行:否则启动会报错 把: 'domaincontroller': NeedAut ...

  5. docker run、commit报错

    1.docker commit 报错 Error response from daemon: devmapper: Error mounting '/dev/mapper/docker-253:2-1 ...

  6. Java调度线程池ScheduleExecutorService(续)

    链接 Java线程池详解(一) Java线程池详解(二) Java调度线程池ScheduleExecutorService 上面列出了最近写的关于java线程池ScheduleExecutorServ ...

  7. oracle12C--DG 状态集

    一,物理备库 01,状态查询与状态详解 select switchover_status from v$database 02,状态转换到备用数据库 alter database commit to ...

  8. yield用法

    yield的__next__()和send()的用法,详见代码 def D(): n = 1 while n < 5: m = yield n print("m:",m) p ...

  9. zookeeper JAVA API 简单操作

    package org.admln.program.Zoo_Test; import java.io.IOException; import java.security.NoSuchAlgorithm ...

  10. laravel框架的rabbitmq使用示例[多队列封装]

    RabbitMQ是实现了高级消息队列协议(AMQP)的开源消息代理软件(亦称面向消息的中间件).RabbitMQ服务器是用Erlang语言编写的,而集群和故障转移是构建在开放电信平台框架上的.所有主要 ...