对Ajax封装为模块

       这是原来一个项目中我所封装的Ajax的模块，非常MINI，能应付基本的Ajax使用，方面自己随时查阅和修正，也方面大家借鉴和指正。

// ====== 封装的AJAX库 ======

// 定义名称空间，简单的可以理解为package
var net = new Object();
// 定义Ajax的状态
net.READY_STATE_UNINITIALIZED = 0;
net.READY_STATE_LOADING = 1;
net.READY_STATE_LOAD = 2;
net.READY_STATE_INTERACTIVE = 3;
net.READY_STATE_COMPLATE = 4;
net.HTTP_SUCCESS_CODE = 200;

// ContentLoader工具类的构造方法
/*
* httpMethod    以get或者post方式
* url            服务器端的出来URL
* params        请求参数
* callback        回调方法
*/
net.ContentLoader = function(httpMethod, url, params, callback) {
    this.xmlhttp = null;
    this.sendRequest(httpMethod === 'undifined'? "post" : httpMethod , url, callback, params);
}

// 使用JavaScript中原型的机制定义对象结构
net.ContentLoader.prototype = {
    // 核心的处理方法
    sendRequest : function(httpMethod, url, callback, params) {
        // 创建XMLHttpRequest对象
        if(window.XMLHttpRequest) {
            this.req = new XMLHttpRequest();
        } else if(window.ActiveXObject) {
            var activeNames = ["Microsoft.XMLHTTP", "MSXML2.XMLHTTP"];
            for(var i = 0; i < activeNames.length; i++) {
                try {
                    this.req = new ActiveXObject(activeNames[i]);
                    break;
                }catch(err) {
                    this.onerror.call(this);
                }
            }
        }
        // 若XMLHttpRequest对象创建成功
        if(this.req) {
            var loader = this;
            try {
                // 注册回调方法
                this.req.onreadystatechange = function() {
                    callback.call(loader);
                }
                // 与服务器端建立连接
                this.req.open(httpMethod,url,true);
               // 对于不同的请求方法提供不同的处理方式
                if(httpMethod == "post") {
                    this.req.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
                    this.req.send(params);
                } else {
                    this.req.send(null);
                }
            }catch(err) {
                // 若发生异常，则调用自己的错误处理机制
                this.onerror.call(this);
            }
        }
    },
    // 自己定义的错误处理方式，自己可扩展
    onerror : function() {
        alert("error fetching data!" +
            "/n/nreadyState: " + this.req.readyState +
            "/nstatus: " + this.req.status +
            "/nheaders: " + this.req.getAllResponseHeaders());
    }
}

//====== 封装的AJAX库 ======

 

使用方式

// 页面按钮实在事件
function sendJsonRequest() {
// 获取页面提交数据
var name = document.getElementById("name").value;
var age = document.getElementById("age").value;
 
 // 拼装请求数据
var params = "name=" + name + "&age=" + age;
 
 // 发送异步请求，这里使用了一个匿名的函数调用方式
var loader = new net.ContentLoader("get", "jsonServlet",params,function() {
  var req = this.req;
  if(req.readyState == net.READY_STATE_COMPLATE) {
   if(req.status == net.HTTP_SUCCESS_CODE) {
    alert(req.responseText);
   }
  }
});
}