一个通用的轻量级AJax框架

这个框架是国外的作品，借来入门学习用，添加了具体中文注释.

个人感觉还是很不错的！！

/**/ /* Simple AJAX Code-Kit (SACK) */
/**/ /* ?005 Gregory Wild-Smith */
/**/ /* www.twilightuniverse.com */
/**/ /* Software licenced under a modified X11 licence, see documentation or authors website for more details */
/**/ /*XMLHTTP.readyState的五种状态
0 － （未初始化）还没有调用send()方法
1 － （载入）已调用send()方法，正在发送请求
2 － （载入完成）send()方法执行完成，已经接收到全部响应内容
3 － （交互）正在解析响应内容
4 － （完成）响应内容解析完成，可以在客户端调用了
*/
function  sack(file)
{
    //定义出错时显示的信息
    this.AjaxFailedAlert = "Your browser does not support the enhanced functionality of this website, and therefore you will have an experience that differs from the intended one.\n";
    //定义请求的URL
    this.requestFile = file;
    //定义请求方式，默认为POST请求
    this.method = "POST";
    //定义请求时带的参数
    this.URLString = "";
    //是否增加时间爱你参数
    this.encodeURIString = true;
    //请求是否成功
    this.execute = false;

    this.onLoading = function() { };//已调用send()方法，正在发送请求
    this.onLoaded = function() { };//send()方法执行完成，已经接收到全部响应内容
    this.onInteractive = function() { };//正在解析响应内容
    this.onCompletion = function() { };//响应内容解析完成，可以在客户端调用了
    //创建xmlhttp对象
    this.createAJAX = function() 
    {
        try 
        {
            this.xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
        } 
        catch (e) 
        {
            try 
            {
                this.xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            } 
            catch (err) 
            {
                this.xmlhttp = null;
            }
        }
        if(!this.xmlhttp && typeof XMLHttpRequest != "undefined")//支持其他类型的浏览器
        {
            this.xmlhttp = new XMLHttpRequest();
        }
        if (!this.xmlhttp)
        {
            this.failed = true;
        }
    };
    //创建xmlhttp对象结束
    
    //设置单个参数格式
    this.setVar = function(name, value)
    {
        if (this.URLString.length < 3)
        {
            this.URLString = name + "=" + value;
        } 
        else 
        {
            this.URLString += "&" + name + "=" + value;
        }
    }
    //将单个参数转码escape()函数也可以实现这种功能 但两者有区别encodeURIComponent 转的范围比较广
    this.encVar = function(name, value)
    {
        var varString = encodeURIComponent(name) + "=" + encodeURIComponent(value);
        return varString;
    }
    //设置多个参数的格式
    this.encodeURLString = function(string)
    {
        varArray = string.split('&');//将多个参数分割
        for (i = 0; i < varArray.length; i++)
        {
            urlVars = varArray[i].split('=');//将单个参数值与名称分开
            if (urlVars[0].indexOf('amp;') != -1)
            {
                urlVars[0] = urlVars[0].substring(4);
            }
            varArray[i] = this.encVar(urlVars[0],urlVars[1]);
        }
        return varArray.join('&');
    }
    //获取返回文档
    this.runResponse = function()
    {
        eval(this.response);
    }
    //运行AJAX
    this.runAJAX = function(urlstring)
    {
        this.responseStatus = new Array(2);//response状态
        if(this.failed && this.AjaxFailedAlert)
        { 
            alert(this.AjaxFailedAlert); //出错时的提示
        } 
        else 
        {
            if (urlstring)//如果urlstring参数存在
            { 
                if (this.URLString.length)//如果有参数
                {
                    this.URLString = this.URLString + "&" + urlstring; 
                }
                else 
                {
                    this.URLString = urlstring; 
                }
            }
            if (this.encodeURIString)//如果编码成功
            {
                var timeval = new Date().getTime(); //定义时间变量
                this.URLString = this.encodeURLString(this.URLString);//编码转换
                this.setVar("rndval", timeval);//追加时间参数
            }
            if (this.element) //获取DOM对象
            { 
                this.elementObj = document.getElementById(this.element);
            }
            if (this.xmlhttp) //如果xmlhttp创建成功
            {
                var self = this;//将this指针定义为self
                if (this.method == "GET") //GET请求
                {
                    var totalurlstring = this.requestFile + "?" + this.URLString;//整个请求URL将页面地址和参数连接
                    this.xmlhttp.open(this.method, totalurlstring, true);//开始异部请求
                }
                else //否则为POST请求
                {
                    this.xmlhttp.open(this.method, this.requestFile, true);
                }
                if (this.method == "POST")
                {
                      try 
                      {
                        this.xmlhttp.setRequestHeader('Content-Type','application/x-www-form-urlencoded')  //追加POST请求表头
                    } 
                    catch (e)
                    {}
                }
                this.xmlhttp.send(this.URLString);//准备好以后，开始发送请求
                this.xmlhttp.onreadystatechange = function() 
                {
                    switch (self.xmlhttp.readyState){
                        case 1: //已调用send()方法，正在发送请求
                            self.onLoading();
                        break; 
                        case 2: //send()方法执行完成，已经接收到全部响应内容
                            self.onLoaded();
                        break;
                        case 3: //正在解析响应内容
                            self.onInteractive();
                        break;
                        case 4: //响应内容解析完成，可以在客户端调用了
                            self.response = self.xmlhttp.responseText;
                            self.responseXML = self.xmlhttp.responseXML;
                            self.responseStatus[0] = self.xmlhttp.status;
                            self.responseStatus[1] = self.xmlhttp.statusText;
                            self.onCompletion();
                            if(self.execute)
                            { 
                                self.runResponse();
                            }
                            if (self.elementObj) 
                            {
                                var elemNodeName = self.elementObj.nodeName;
                                elemNodeName.toLowerCase();
                                if (elemNodeName == "input" || elemNodeName == "select" || elemNodeName == "option" || elemNodeName == "textarea")
                                {
                                    self.elementObj.value = self.response;
                                }
                                else 
                                {
                                    self.elementObj.innerHTML = self.response;
                                }
                            }
                            self.URLString = "";//将参数置空
                        break;
                    }
                };
            }
        }
    };
    
    this.createAJAX();
}

转载于:https://www.cnblogs.com/ComeOn/archive/2008/02/02/1062217.html