一个封装的Ajax类

175 阅读 0 评论 116 点赞

我是靠谱客的博主认真大叔，最近开发中收集的这篇文章主要介绍一个封装的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(); 
        } 
    }     
}