`

ajax封装类

阅读更多
  1. function ajax(method,synchronous){   
  2.     
  3.     this._httpReq = false;  /*ajax初始化对象*/  
  4.     this.method = method;  /*get|post*/  
  5.     this.syn = synchronous;   /*是否采用异步请求,默认true*/  
  6.     
  7.     this.url = "";   /*提交异步请求的url地址*/  
  8.     this.resType = "";  /*异步请求返回数据类型text|xml*/  
  9.     this.callback = "";  /*异步请求完成后的回滚函数*/  
  10.     this.loading = "";  /*load函数*/  
  11.     this.content = null/*Ajax中send方法的参数*/  
  12.     this.readystate = -1; /*ajax的请求状态*/  
  13.     this.state = -1;  /*http请求响应代码*/  
  14.     
  15.      /************ get/set方法开始 ***************/  
  16.      //设置提交异步请求的url地址   
  17.      this.setUrl = function (url){   
  18.           this.url = url;   
  19.      }   
  20.     
  21.      //设置异步请求返回数据类型text|xml   
  22.      this.setResType = function (restype){   
  23.           this.resType = restype;   
  24.      }   
  25.     
  26.      //设置回滚函数   
  27.      this.setCallback = function (func){   
  28.           this.callback = func;   
  29.      }   
  30.     
  31.      //设置load函数   
  32.      this.setLoading = function (loadFunc){   
  33.           this.loading = loadFunc;   
  34.      }   
  35.     
  36.      //设置send自带的参数值,默认null   
  37.      this.setContent = function (contents){   
  38.         this.content = contents;   
  39.      }   
  40.      /*********get/set方法结束*******/  
  41.     
  42.      /*********状态显示方法*********/  
  43.      //调用window.alert方法   
  44.      this.alert = function (msg){   
  45.          window.alert(msg);   
  46.      }   
  47.     
  48.      //调用window.status的方法   
  49.      this.status = function (msg){   
  50.           window.status = msg;   
  51.      }   
  52.      /*********状态显示方法结束*********/  
  53.     
  54.      /*************执行方法开始*****************/  
  55.      //创建HttpXMLRequest   
  56.      this.createXMLRequest = function(){   
  57.      if(window.XMLHttpRequest){   
  58.            this._httpReq = new XMLHttpRequest();   
  59.       
  60.            if(this._httpReq.overrideMimeType){   
  61.                this._httpReq.overrideMimeType("text/xml");   
  62.            }   
  63.       }else if(window.ActiveXObject){   
  64.             try{   
  65.                  this._httpReq = new ActiveXObject("Msxml2.XMLHTTP");   
  66.             }catch(e){   
  67.                   try{   
  68.                        this._httpReq = new ActiveXObject("Microsoft.XMLHTTP");   
  69.                   }catch(e){}   
  70.             }    
  71.       }   
  72.  }   
  73.     
  74.      //初始化ajax对象   
  75.      this.init = function(){   
  76.           this.createXMLRequest();   
  77.      }   
  78.     
  79.      //发送一个http请求   
  80.      this.send = function (){   
  81.           if(this.resType.toLowerCase()=="post"){   
  82.                   _httpReq.setRequestHeader("Content-Type","application/x-www-form-urlencoded");   
  83.           }   
  84.           this._httpReq.open(this.method,this.url,this.syn);   
  85.           this._httpReq.send(this.content);   
  86.      }   
  87.     
  88.         //取消一个http请求   
  89.         this.abort = function (){   
  90.                this._httpReq.abort();   
  91.         }   
  92.     
  93.       this.callbackState = function(){   
  94.             switch(this._httpReq.readyState){   
  95.                    case 0:   
  96.                             this.readystate = 0;   
  97.                             break;   
  98.                    case 1:   
  99.                             this.readystate = 1;   
  100.                             break;   
  101.                    case 2:   
  102.                             this.readystate = 2;   
  103.                             break;   
  104.                    case 3:   
  105.                             this.readystate = 3;   
  106.                             break;   
  107.                    case 4:   
  108.                             this.readystate = 4;   
  109.                             switch(this._httpReq.status){   
  110.                                    case 200:   
  111.                                            eval(this.callback);   
  112.                                            break;   
  113.                                    case 202:   
  114.                                            this.status("请求处理中,还没处理完毕!");   
  115.                                            break;   
  116.                                    case 400:   
  117.                                            this.status("错误的请求!");   
  118.                                            break;   
  119.                                    case 404:   
  120.                                            this.status("请求资源未找到!");   
  121.                                            break;   
  122.                                    case 500:   
  123.                                            this.status("内部服务器错误,请联系管理员!");   
  124.                                            break;   
  125.                                    default:   
  126.                                            this.status("返回数据失败,"+this._httpReq.status);   
  127.                                            break;   
  128.                               }   
  129.                               break;   
  130.                    default:   
  131.                            this.readystate = 0;   
  132.                            break;   
  133.              }   
  134.      }   
  135.   
  136.      this.onReadyStateChange = function (){   
  137.             var owner = this;   
  138.             this._httpReq.onreadystatechange = function(){   
  139.                    owner.callbackState.call(owner);   
  140.             }   
  141.      }   
  142.  /*************执行方法结束*****************/  
分享到:
评论
2 楼 jmwjy 2012-07-05  
还有,能否指点下这个问题

看了你的文章,我才我发现我好象也是要写一个封装(封装对我来说,太高深了),但是总有问题。

http://bbs.51js.com/thread-90328-1-1.html
1 楼 jmwjy 2012-07-05  
博主,能否指点下,这个怎么调用……
我正在学ajax,希望您指点下

相关推荐

    自己用的简单封装AJAX类

    **标题解析:** "自己用的简单封装AJAX类" 指的是作者为了个人使用需求,编写了一个简化的AJAX处理类。AJAX(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术,...

    AJAX封装类使用指南

    AJAX 封装类使用指南 AJAX 封装类是一种 JavaScript 库,用于简化 AJAX 请求的使用。AJAX(Asynchronous JavaScript and XML)是一种异步请求技术,允许网页在不刷新页面的情况下,向服务器请求数据。使用 AJAX ...

    收集的ajax封装类

    搜集的ajax类,同步异步,post get 都有涉及。并封装成类以便调用。

    超轻量级好用的js AJAX封装类

    如果是做基于广域网应用的web程序,这个ajax类最合适不过了,ajax功能全,简单好用堪比jquery,最重要的是,它无比轻量级,与jquery、extjs等框架的ajax相比,它小多了,可大大减轻网络传输压力,有效提升web访问...

    ajax封装类AJAXRequestv0.8.10修正版

    注意:从脚本之家下载的此版本,已经修正了,可以直接使用,不必修改了在写 AJAXRequest v0.8.10 版时,没有在 IE6 下面测试,导致在 IE6 下面出现“XMLHttpRequest未定义”的错误。 可以按如下方法修正,在 ajax...

    Ajax封装

    在实际的Web应用开发中,Ajax封装类是常见的实践,它可以帮助开发者更方便、高效地进行异步数据交互,提高用户体验。下面我们将深入探讨Ajax封装的原理、实现方式以及如何使用。 **Ajax原理** Ajax的核心是...

    ajax封装实例代码

    Ajax封装则是将常见的Ajax操作进行模块化处理,方便开发者在项目中快速、高效地实现数据交互。本篇文章将深入探讨Ajax封装实例代码及其相关知识点。 首先,我们来看Ajax的核心原理:通过JavaScript创建...

    jquery Ajax 全局调用封装实例详解

    一个简洁的Ajax封装类通常包括几个参数:请求地址`url`、发送的数据`data`、请求方式`type`、请求类型`dataType`、请求成功回调函数`successfn`和请求失败回调函数`errorfn`。根据这些参数,可以封装成多个不同的...

    封装ajax的js类

    封装ajax与servlet通信的js类,欢迎指正

    自己封装的Ajax类

    3、封装了访问Ajax和WebService的API。WebService兼容SOAP1.1和SOAP1.2 4、该资源为作者本人劳动成果。使用方式可以参考另一资源(javascript访问WebService,js未经封装,但使用方式一样)如有疑问或建议请留言,如有...

    Ajax 动态表单验证封装类附示例

    一个Ajax动态表单验证封装类通常包含以下功能: 1. **事件监听**:监听表单元素的事件,如`onkeyup`、`onblur`等,以便在用户停止输入或离开字段时触发验证。 2. **异步请求**:当触发验证事件时,通过Ajax向...

    封装ajax上传通用类

    封装ajax上传通用类,方便使用,省去繁琐步骤.

    ajax封装的dll

    本话题将深入探讨“ajax封装的dll”,这是一种将Ajax功能封装到动态链接库(DLL)中的做法,使得开发者可以更方便地在项目中调用和利用Ajax功能。 首先,DLL(Dynamic Link Library)是Windows操作系统中的一种共享...

    jQuery Ajax 全局调用封装实例代码详解

    接下来,我们可以定义一个全局的Ajax封装类,称为“linjq”,这个封装类通过内部的函数来实现不同的请求方式,并且可以处理各种请求参数和回调函数。封装类通常定义在文档加载完成后立即执行的函数中,这样做可以...

    web ajax 的使用 js封装

    【标题】"Web AJAX 使用与JS封装" 在Web开发中,AJAX(Asynchronous JavaScript and XML)是一种核心技术,它使得页面无需重新加载整个网页就能与服务器交换数据并更新部分网页内容。JavaScript是实现AJAX的核心...

    已封装Ajax操作类

    这个“已封装Ajax操作类”显然提供了一种简化Ajax调用的方式,使得开发者可以更便捷地实现异步通信。以下是对这个主题的详细讲解: 首先,Ajax的核心在于XMLHttpRequest对象,这是一个浏览器内置的对象,它允许...

    浅析jQuery Ajax通用js封装

    ### 第二步:开发Ajax封装类 接下来,我们创建一个通用的Ajax封装函数。这里提供了一个名为`jQuery.ax`的函数,它可以接受多个参数,包括请求的URL、发送的数据、异步设置、请求类型、预期的数据类型以及成功和失败...

Global site tag (gtag.js) - Google Analytics