一个方便AJAX开发的通用类

所属分类: 网络编程 / AJAX相关 阅读数: 1380
收藏 0 赞 0 分享
Name: AJAXRequest
Author: HotHeart(xujiwei)
Site: http://www.xujiwei.cn/
Blog: http://www.xujiwei.cn/blog/
Copyright (c) 2006, All Rights Reserved

类名:AJAXRequest
版本:0.3
日期:2006-12-18
介绍:AJAXRequest是一个方便AJAX开发的通用类,可以方便地进行一些AJAX中需要的操作,从而简化开发步骤,减少重复代码编写量。

创建方法:
var ajaxobj=new AJAXRequest([url],[callback],[content],[method],[async]);
如果创建失败则返回false

属性:
url       - 请求URL,字符串,默认为空
callback  - 回调函数,即返回响应内容时调用的函数,默认为直接返回,回调函数有一个参数为XMLHttpRequest对象,即定义回调函数时要这样:function mycallback(xmlobj)
content   - 请求的内容,如果请求方法为POST需要设定此属性,默认为空字符串
method    - 请求方法,字符串,POST或者GET,默认为POST
async      - 是否异步,true为异步,false为同步,默认为true

方法
function send([url],[callback],[content],[method],[async])
发送请求,可选参数列表为空就使用对象属性

function get([url],[callback])
使用GET方法请求一个URL,可选参数默认使用对象属性

function post(form_obj,[callback],[url],[method])
发送一个表单到指定URL,form_obj为指定表单对象,可选参数为空时使用对象属性

示例:
1. get方法
function test1() {
    var ajax=new AJAXRequest;
    ajax.get(
        "test.asp",
        function(obj) {
            document.getElementById("test1").value=obj.responseText;
        }
    );
}
2. post方法
function test2() {
    var ajax=new AJAXRequest;
    ajax.post(
        document.getElementById("test2c"),
        function(obj) {
            document.getElementById("test2r").innerHTML=obj.responseText;
        }
    );
}
复制代码 代码如下:

/*------------------------------------------
Author: xujiwei
Website: http://www.xujiwei.cn
E-mail: vipxjw@163.com
Copyright (c) 2006, All Rights Reserved
------------------------------------------*/
function AJAXRequest() {
    var xmlObj = false;
    var CBfunc,ObjSelf;
    ObjSelf=this;
    try { xmlObj=new XMLHttpRequest; }
    catch(e) {
        try { xmlObj=new ActiveXObject("MSXML2.XMLHTTP"); }
        catch(e2) {
            try { xmlObj=new ActiveXObject("Microsoft.XMLHTTP"); }
            catch(e3) { xmlObj=false; }
        }
    }
    if (!xmlObj) return false;
    if(arguments[0]) this.url=arguments[0]; else this.url="";
    if(arguments[1]) this.callback=arguments[1]; else this.callback=function(obj){return};
    if(arguments[2]) this.content=arguments[2]; else this.content="";
    if(arguments[3]) this.method=arguments[3]; else this.method="POST";
    if(arguments[4]) this.async=arguments[4]; else this.async=true;
    this.send=function() {
        var purl,pcbf,pc,pm,pa;
        if(arguments[0]) purl=arguments[0]; else purl=this.url;
        if(arguments[1]) pc=arguments[1]; else pc=this.content;
        if(arguments[2]) pcbf=arguments[2]; else pcbf=this.callback;
        if(arguments[3]) pm=arguments[3]; else pm=this.method;
        if(arguments[4]) pa=arguments[4]; else pa=this.async;
        if(!pm||!purl||!pa) return false;
        xmlObj.open (pm, purl, pa);
        if(pm=="POST") xmlObj.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
        xmlObj.onreadystatechange=function() {
            if(xmlObj.readyState==4) {
                if(xmlObj.status==200) {
                    pcbf(xmlObj);
                }
                else {
                    pcbf(null);
                }
            }
        }
        if(pm=="POST")
            xmlObj.send(pc);
        else
            xmlObj.send("");
    }
    this.get=function() {
        var purl,pcbf;
        if(arguments[0]) purl=arguments[0]; else purl=this.url;
        if(arguments[1]) pcbf=arguments[1]; else pcbf=this.callback;
        if(!purl&&!pcbf) return false;
        this.send(purl,"",pcbf,"GET",true);
    }
    this.post=function() {
        var fo,pcbf,purl,pc,pm;
        if(arguments[0]) fo=arguments[0]; else return false;
        if(arguments[1]) pcbf=arguments[1]; else pcbf=this.callback;
        if(arguments[2])
            purl=arguments[2];
        else if(fo.action)
            purl=fo.action;
        else
            purl=this.url;
        if(arguments[3])
            pm=arguments[3];
        else if(fo.method)
            pm=fo.method.toLowerCase();
        else
            pm="post";
        if(!pcbf&&!purl) return false;
        pc=this.formToStr(fo);
        if(!pc) return false;
        if(pm) {
            if(pm=="post")
                this.send(purl,pc,pcbf,"POST",true);
            else
                if(purl.indexOf("?")>0)
                    this.send(purl+"&"+pc,"",pcbf,"GET",true);
                else
                    this.send(purl+"?"+pc,"",pcbf,"GET",true);
        }
        else
            this.send(purl,pc,pcbf,"POST",true);
    }
    // formToStr
    // from SurfChen <surfchen@gmail.com>
    // @url     http://www.surfchen.org/
    // @license http://www.gnu.org/licenses/gpl.html GPL
    // modified by xujiwei
    // @url     http://www.xujiwei.cn/
    this.formToStr=function(fc) {
        var i,query_string="",and="";
        for(i=0;i<fc.length;i++) {
            e=fc[i];
            if (e.name!='') {
                if (e.type=='select-one') {
                    element_value=e.options[e.selectedIndex].value;
                }
                else if (e.type=='checkbox' || e.type=='radio') {
                    if (e.checked==false) {
                        continue;    
                    }
                    element_value=e.value;
                }
                else {
                    element_value=e.value;
                }
                element_value=encodeURIComponent(element_value);
                query_string+=and+e.name+'='+element_value;
                and="&";
            }
        }
        return query_string;
    }
}
更多精彩内容其他人还在看

理解jquery ajax中的datatype属性选项值

jquery中ajax的dataType属性用于指定服务器返回的数据类型,如果不指定,jQuery 将自动根据HTTP包MIME信息来智能判断,如果datatype选项不填写的话,会将返回的数据当成字符串处理。
收藏 0 赞 0 分享

基于Jquery ajax技术实现间隔N秒向某页面传值

这篇文章给大家介绍jquery ajax技术实现每隔一段时间向某页面传值,以及setinterval()方法的语法介绍,对本文感兴趣的朋友可以参考下
收藏 0 赞 0 分享

通过Ajax两种方式讲解Struts2接收数组表单的方法

使用struts2表单传值,可以传一个或者是作为一个对象的各个属性传,都非常灵活便捷。但是如果我们需要传一个数组并希望struts正确接收,该怎么处理呢?接下来,通过本文给大家介绍通过Ajax两种方式讲解Struts2接收数组表单的方法,需要的朋友可以参考下
收藏 0 赞 0 分享

基于Jquery.history解决ajax的前进后退问题

本文主要给大家介绍基于Jquery.history解决ajax的前进后退问题,涉及到jquery前进后退相关方面的知识,本文内容经典,非常具有参考价值,特此把jquery前进后退相关知识分享在脚本之家网站供大家参考
收藏 0 赞 0 分享

使用HTML5中postMessage知识点解决Ajax中POST跨域问题

这篇文章主要介绍了使用HTML5中postMessage知识点解决Ajax中POST跨域问题的相关资料,需要的朋友可以参考下
收藏 0 赞 0 分享

谈谈你对aja的理解(一、二)

Ajax是Asynchronous Javascript And XML的缩写,其作用通过Ajax可以使用Javascript语句来调用XMLHttpRequest对象,直接与服务器进行通讯,可以在不重载页面的情况下与服务器交换数据。
收藏 0 赞 0 分享

关于ajax对象一些常用属性、事件和方法大小写比较常见的问题总结

最近比较空闲,于是抽个时间整理些关于ajax方法的东东。在项目中经常发现ajax板块好多问题都是属性,方法,事件大小写不区分问题,最终导致了程序运行出现麻烦,下面给大家介绍关于ajax对象一些常用属性、事件和方法大小写比较常见的问题总结
收藏 0 赞 0 分享

Ajax请求session失效该如何解决

HTML + Servlet + Filter + jQuery 一般来说我们的项目都有登录过滤器,一般请求足以搞定。但是AJAX却是例外的,所以解决方法是设置响应为session失效。
收藏 0 赞 0 分享

编写轻量ajax组件02--浅析AjaxPro

ajaxpro虽然是一个比较老的组件,不过实现思想和源码还是很有借鉴价值的。接下来通过本篇文章给大家介绍编写轻量ajax组件02--浅析AjaxPro,感兴趣的朋友可以参考下
收藏 0 赞 0 分享

编写轻量ajax组件01-与webform平台上的各种实现方式比较

这篇文章主要介绍了编写轻量ajax组件01-与webform平台上的各种实现方式比较,需要的朋友可以参考下
收藏 0 赞 0 分享
查看更多