`
邪神Saber
  • 浏览: 41437 次
文章分类
社区版块
存档分类
最新评论

纯JS封装Ajax对象

 
阅读更多

封装好的对象:

var Ajax = function (sUrl, sMethod, oParam, fCallback) {
    this.sUrl = sUrl;
    this.sMethod = sMethod;
    this.oParam = oParam;
    this.fCallback = fCallback;
    this.status = {
        1: '请求成功',
        2: 'http返回失败',
        3: '数据加载中'
    }
    this.xmlHttp = null;
    //驱动函数  
    this.Driver = function () {
        this.xmlHttp = this.CreateXmlHttp();
        this.xmlHttp.open(this.sMethod, this.sUrl, true);
        this.xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
        this.xmlHttp.onreadystatechange = GetResult; //指定回调函数   
        this.xmlHttp.send(this.oParam); //发送请求   
    };
    //创建操作对象  
    this.CreateXmlHttp = function () {
        var xmlHttp;
        if (window.ActiveXObject) { //IE下   
            xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        if (window.XMLHttpRequest) { //其他浏览器如火狐   
            xmlHttp = new XMLHttpRequest();
        }
        return xmlHttp;
    };
    //回调方法  
    var GetResult = function () {
        if (this.readyState == 4) {//请求状态为4表示成功    
            if (this.status == 200) {//http状态200表示OK    
                eval(fCallback)(this.responseText);
            } else {//http返回状态失败    
                return this.status[2];
            }
        } else {//请求状态还没有成功,页面等待    
            return this.status[3];
        }
    }
}


调用方法:

new Ajax('test.php', 'get', {}, function (responseText) {
    alert(responseText);
}).Driver();


分享到:
评论

相关推荐

    纯js封装原生ajax

    纯js封装原生ajax,XMLHttpRequest/ActiveXObject对象封装

    自己封装的Ajax类

    1、采用面向对象和JSON封装方式。 2、创建XMLHttpRequest兼容主流浏览器,采用连接池...使用方式可以参考另一资源(javascript访问WebService,js未经封装,但使用方式一样)如有疑问或建议请留言,如有异议请...,谢谢

    一个面向对象的ajax通用脚本(封装好的可当框架来用)

    ajax通用脚本是利用了面向对象的编程用javascript代码把把ajax主要的方法封装好,用的时候只要先set后get就行啦,比框架还容易用,只有一个js文件,导入来就可以用啦,里面还带了一个例子,学过编程的朋友一看就会.....

    Ajax 简单封装类库

    ajax轻量级封装,简单实用,带有详细注释。 一、同一个对象可以发送多个请求,按顺序执行请求,有简单的超时机制,httpXMLRequest对象复用,无序的可以建立多个对象发送请求来实现; 二、兼容IE,FF,支持同步、异步...

    原生js实现对Ajax的封装(仿jquery)

    首先我们封装的函数为了能实现可传入无限多个参数,在使用我们即将封装的函数时,需要使用对象进行传参,形式如下: //data作为参数传入我们下面封装的函数 var data = { //数据 user:"yonghu1", pass:'

    原生JS封装Ajax插件(同域、jsonp跨域)

    用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的。。。简单说说思路,如有不正确的地方,还望指正^_^ 一、Ajax核心,创建XHR对象 Ajax技术的核心是XMLHttpRequest对象(简称XHR),IE5是第一...

    使用原生js封装的ajax实例(兼容jsonp)

    /* 封装ajax函数 * @param {string}opt.type http连接的方式,包括POST和GET两种方式 * @param {string}opt.url 发送请求的url * @param {boolean}opt.async 是否为异步请求,true为异步的,false为同步的 * @...

    Ajax.js:封装了Ajax操作的简易工具

    这里采用单例模式封装成一个对象,即只有一个全局的变量将其赋值给Ajax,该对象有一个request方法。request有两个参数,第一个为请求的url(必要的),字符串类型,第二个opt为配置参数(可选的),对象类型。 目前提供...

    原生js封装的ajax方法示例

    本文实例讲述了原生js封装的ajax方法。分享给大家供大家参考,具体如下: 众所周知,框架之间会有冲突,这是源生js就起到作用了,下面介绍一种源生js封装的ajax请求。 function ajax(options) { options = options...

    封装JavaScript / Ajax 脚本

    自己总结的JavaScript异步访问的方法。其中有比较详尽的注释。第一个方法返回字符串。第二个方法返回一个XMLDocument对象,可以通过URL生成一个XML文档。

    js实现对ajax请求面向对象的封装

    在js中使用ajax请求一般包含三个步骤: 1、创建XMLHttp对象 2、发送请求:包括打开链接、发送请求 3、处理响应 在不使用任何的js框架的情况下,要想使用ajax,可能需要向下面一样进行代码的编写 ...

    一个ajax功能的JS xml读取封装类代码.rar

    一个实现ajax功能的JS xml读取封装类代码,在这个JavaScript类里面,有核心的读取XML文件的代码,同时还包括了新建XML文档对象、在IE下使用ActiveX来创建,异步读取XML文件,创建XMLHttp对象,以备XML文档对象无法...

    prototype.js的Ajax对象

    我想prototype.js里的ajax对象肯定吸引了不少人,大量封装好的ajax逻辑的类,对于我们这些初学者使用ajax有很大的帮助。 以下用一个我的具体使用例子来解释:效果看这里 1. Ajax.Request 你可以这样创建它 代码如下...

    用原生JS对AJAX做简单封装的实例代码

    首先,我们需要xhr对象。这对我们来说不难,封装成一个函数。 var createAjax = function() { var xhr = null; try { //IE系列浏览器 xhr = new ActiveXObject("microsoft.xmlhttp"); } catch (e1) { try { //非IE...

    原生js仿jquery实现对Ajax的封装

    首先我们封装的函数为了能实现可传入无限多个参数,在使用我们即将封装的函数时,需要使用对象进行传参,形式如下: //data作为参数传入我们下面封装的函数 var data = { //数据 user:"yonghu1", pass:'12345', ...

    新手练习 Ajax请求封装进JavaScript类

    初学者(同胞们)可以看一下, 高手们就闪吧(小弟不才)。 Ajax请求封装 超时处理 不能同时请求一次,但可以声明两个对象来完成。 IE和FF兼容问题(只测部分)

    北京中科信软AJAX培训

    JavaScript与Ajax JavaScript基本数据结构 JavaScript表达式和运算符 JavaScript的流程控制和函数 JavaScript的对象 窗口及输入输出 DOM DOM与Ajax DOM眼中的HTML文档——树 HTML文档的节点 使用DOM操作HTML文档 ...

    PCAS(省市县联动选择JS封装类) v2.03 数据压缩完整版.rar

    PCAS (Province City Area Selector 省、市、地区联动选择JS封装类) Ver 2.03 数据压缩完整版,包括:pcasunzip.js和PCASClass.js两个JS文件 应用说明: 页面包含[removed][removed] 省市联动 new PCAS(...

    传智博客Ajax 源码

    详细介绍了Ajax原理,XMLHttpRequest对象,jquery对Ajax和JavaScript的封装以及它实现的特效,Css效果,javaScript的Dom操作。

Global site tag (gtag.js) - Google Analytics