一个封装的Ajax类

用法: 
new Ajax().Request(url,cmd,async,method,postString,title) 
参数: 
url: 请求页面URL（必填） 
cmd: 返回值处理函数（必填） 
async: 是否异步 ,(ture|false), 默认true 
method: 请求方式,(post|get), 默认get 
postString: 请求方式为post时,请求内容 
title: 请求内容标题 


代码如下:

// Ajax 封装 2007-3-13
function createXMLHttpRequest() {
    try {        
            if (window.XMLHTTPRequest) {
                    return new XMLHttpRequest();
            }
            else if (window.ActiveXObject) {
                return new ActiveXObject("Microsoft.XMLHTTP");
            }
        }
        catch (e) {alert("XMLHttpRequest对象无法创建！请检查IE安全设置！");}
}
function messageDiv(t)
{
    var v = document.createElement("<div>");
    v.innerHTML = "<table style=\"width:300px;\" id=message>" +
                  "<tr style=\"font-size:12px;background-color:#EEEEff;color:#227933;height:20px\">" + 
                  "<td style=\"padding:2px;border-top:1px solid #E1E1E1;border-left:1px solid #E1E1E1;border-bottom:1px solid #818181;border-right:1px solid #A1A1A1\">" +
                  "<nobr><img src=refresh.gif align=absmiddle> " + t + ",<span id=Span1>连接未初始化...</span></nobr></td></tr></table>";
    var l = document.getElementsByName("message").length;
    v.style.cssText = "position:absolute;bottom:" + (l*24) + "px;left:0px;display:none";
    document.body.appendChild(v);
    this.clear = function () {
        document.body.removeChild(v);
        var msg = document.getElementsByName("message");
        for (var i=0;i<msg.length;i++){
            msg[i].parentNode.style.cssText = "position:absolute;bottom:" + (i*24) + "px;left:0px";
        }
    }
    this.showmsg = function (s) {
        v.style.display = "";
        v.all.Span1.innerHTML = s;
    }
}
function Ajax() {
    var x = new createXMLHttpRequest();
    this.Request = function (url,cmd,async,method,postString,title) {
        if (method!="post") method = "post"; else method = "get";
        if (async!=true) async = true; else async = false;
        if (typeof(postString)!="string") postString="";
        if (typeof(title)!="string") title="正在获取数据"; else title="正在获取" + title;
        var msgbox = new messageDiv(title);
        x.onreadystatechange = function ()
        {
            if (async) switch (x.readystate) {
            case 1:
                msgbox.showmsg("正在初始化连接...");
                return;
            case 2:
                msgbox.showmsg("正在发送数据...");
                return;
            case 3:
                msgbox.showmsg("正在接收数据...");
                return;
            case 4:
                msgbox.showmsg("数据接收完成...");
                if (x.status == 200) {
                    cmd(x.responseText);
                    msgbox.clear();
                }
                else {
                    msgbox.showmsg("请求失败," + x.statustext + "(" + x.status + ")");
                    setTimeout(msgbox.clear,3000);
                }
                return;
            }
        }
        x.open (method,url,async);
        if (method=="post") {msgbox.showmsg("正在接收数据...");x.send(postString);} else x.send();
        if (!async) {
            msgbox.showmsg("数据接收完成...");
            cmd(x.responseText);
            msgbox.clear();
        }
    }    
}

赞 (0)

相关推荐

  • 原生Javascript封装的一个AJAX函数分享

    最近的工作中涉及到大量的ajax操作,本来该后台做的事也要我来做了.而现在使用的ajax函数是一个后台人员封装的--但他又是基于jquery的ajax,所以离开了jquery这个函数就毫无作用了.而且我觉得,jquery的ajax方法是很完善的了,可以直接用,如果都有jquery了,那么他的ajax就不用白不用了.我缺少的是一个能在没有jquery的情况下使用的ajax方法. 所以我也花一天时间写了一个,参数与调用方法类似于jquery的ajax.就叫xhr吧,因为xhr=XMLHttpRequ

  • 基于jQuery的ajax方法封装

    ajax (ajax开发)简介 AJAX即"Asynchronous Javascript And XML"(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术. AJAX = 异步 JavaScript和XML(标准通用标记语言的子集). AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. 在实际的项目里,ajax的应用频率很高

  • js原生Ajax的封装和原理详解

    原理及概念 AJAX即"Asynchronous Javascript And XML"(异步JavaScript和XML),是一种用于创建快速动态网页的技术. 动态网页:是指可以通过服务器语言结合数据库随时修改数据的网页. 静态网页,随着html代码的生成,页面的内容和显示效果就基本上不会发生变化了--除非你修改页面代码. AJAX = 异步 JavaScript和XML(标准通用标记语言的子集). AJAX 是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下. A

  • ajax的工作原理以及异步请求的封装介绍

    Ajax原理: 客户端通过浏览器的内置对象XMLHttpRequest来发送异步请求,当服务器返回响应时,会调用先前注册的回调函数,在回调函数中可以使用javascript操作DOM来更新页面,异步请求不会阻塞客户端的操作,达到页面无法刷新就可以更新数据的效果. 异步请求的封装: 复制代码 代码如下: var xhr=false; //step1:创建一个兼容浏览器各个版本的XMLHttpRequest对象 if (window.XMLHttpRequest) { //IE7+, Firefox

  • 关于Ajax的原理以及代码封装详解

    前言 其实AJAX内部实现并不麻烦,主要通过一个叫XMLHttpRequest的对象,而这个对象在现有的浏览器均被支持. 可以说,它是整个AJAX实现的基础,是浏览器用于后台与服务器交换数据的对象,有了它,才有了AJAX,也便有了部分页面刷新的艺术! 本文主要给大家介绍了关于Ajax原理以及代码封装的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧. 示例代码 var xmlhttp; if (window.XMLHttpRequest) { // code for IE

  • 自己动手封装的 ajax

    以前开发用了很多AJAX的技术比如EXT,prototype,jQuery等等,但都是开源封装好的AJAX框架.从没真正用过纯正的AJAX,故参照prototyp面向对象思想自己封装了一个AJAX框架.希望能给读者参考.帮助.评价. 复制代码 代码如下: /* * 自己封装的ajax * * * @author 姜松 * @version 1.00 $date:2009-07-02 * * history: * */ Object.extend = function(destination, s

  • 封装了jQuery的Ajax请求全局配置

    摘要: jQuery已经成为项目中最常见的js库,也是前端开发最喜欢使用的库.下面是在项目中封装了jQuery的Ajax,分享给大家. 代码: 复制代码 代码如下: // ajax 请求参数 var ajaxSettings = function(opt) {     var url = opt.url;     var href = location.href;     // 判断是否跨域请求     var requestType = 'jsonp';     if (url.indexOf

  • 一个封装的Ajax类

    用法:  new Ajax().Request(url,cmd,async,method,postString,title)  参数:  url: 请求页面URL(必填)  cmd: 返回值处理函数(必填)  async: 是否异步 ,(ture|false), 默认true  method: 请求方式,(post|get), 默认get  postString: 请求方式为post时,请求内容  title: 请求内容标题  复制代码 代码如下: // Ajax 封装 2007-3-13 fu

  • 一个简单的AJAX请求类

    在给blog加上无刷新搜索和即时验证检测后,又看了下代码,感觉太过麻烦,就把XMLHttpRequest请求封装到一个类里面,用起来方便多了,不用记那么多代码,什么创建XMLHttpRequest对象什么的,这部分代码也是重用性比较高的-已经打包,在日志的末尾下载. 要看效果的话点开侧边栏里的日志搜索,里面有一个无刷新搜索,就是了,或者在阅读日志或留言簿里的注册码那里有即时检测,如果不输入验证码或者输错了验证码,输入框都会变红的^_^ 类名:AJAXRequest 创建方法:var ajaxob

  • 封装的一个asp.net验证码类

    第一个反映是验证码的这些属性是否可以设置(也就是说是封装成一个类,然后以暴露公有属性和方法的方式来使用的,还是在直接在一般处理程序中实现了验证码的生成到输出),结果比较可惜,是后者...... 里面的算法感觉挺不错,至少对于我这种对算法几乎是不懂的人来说是这样,于是想到去封装一下她然后无耻地纳入自己的类库中去^^ old原文件如下:点击下载 首先分析一下这份代码中的不足(自己觉得的): 1.面向过程式的编程,如果要修改验证码的属性,例如修改字体的大小.背景颜色等细节的东西,需要去一般处理程序中找

  • PHP封装返回Ajax字符串和JSON数组的方法

    实例如下: <?php class DBDA { public $host="localhost"; public $uid = "root"; public $pwd = "123"; public $dbname = "mydb"; //成员方法 public function Query($sql,$type=1) { $db = new MySQLi($this->host,$this->uid,$t

  • 关于二次封装jquery ajax办法示例详解

    前言 Ajax 的全称是Asynchronous JavaScript and XML 异步的javaScript和XML AJax所涉及到得技术: 1.使用CSS和XHTML来表示. 2. 使用DOM模型来交互和动态显示. 3.使用XMLHttpRequest来和服务器进行异步通信.(核心) 4.使用javascript来绑定和调用. 在我们前端处理数据的时候免不了要 ajax 与后台通信, ajax 是通过 XMLHttpRequest 对象与服务器进行通信的, jquery 在 XMLHt

  • 基于原生ajax与封装的ajax使用方法(详解)

    基于原生ajax与封装的ajax使用方法(详解)

    当我们不会写后端接口来测试ajax时,我们可以使用node环境来模拟一个后端接口. 1.模拟后端接口可参考网站整站开发小例子,在打开命令窗口并转到所在项目文件夹下在命令行中输入npm install express --save,安装express中间件. 2.把当中的app.js的内容换成 var express=require('express'); //var path=require('path'); var app=express(); //app.set('view',path.jo

  • PHP封装的HttpClient类用法实例

    本文实例讲述了PHP封装的HttpClient类.分享给大家供大家参考.具体分析如下: 这是一段php封装的HttpClient类,可实现GET POST Cookie Session等简单的功能.原来做过,这两天重新修改了一下. <?php /* * Filename: httpclient.php * Created on 2012-12-21 * Created by RobinTang * To change the template for this generated file go

  • php封装的mysqli类完整实例

    本文实例讲述了php封装的mysqli类.分享给大家供大家参考,具体如下: 类: <?php header('content-type:text/html;charset=utf-8'); /* 掌握满足单例模式的必要条件 (1)私有的构造方法-为了防止在类外使用new关键字实例化对象 (2)私有的成员属性-为了防止在类外引入这个存放对象的属性 (3)私有的克隆方法-为了防止在类外通过clone成生另一个对象 (4)公有的静态方法-为了让用户进行实例化对象的操作 */ class Connect

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

    实例如下: /* 封装ajax函数 * @param {string}opt.type http连接的方式,包括POST和GET两种方式 * @param {string}opt.url 发送请求的url * @param {boolean}opt.async 是否为异步请求,true为异步的,false为同步的 * @param {object}opt.data 发送的参数,格式为对象类型 * @param {function}opt.success ajax发送并接收成功调用的回调函数 */

随机推荐