//GetHttpObject方法的作用是初始化XMLHttpRequest对象 function CallBackObject() { this.XmlHttp = this.GetHttpObject();}
/*名词解释: 修饰符: (原型)prototype 解 释: 使用原型对象的属性来创建继承属性和共享方法. 原型属性和方法将采用引用的方式复制给类中的每个对象,他们都具有相同的值, 可以在一个对象中, 更改原型属性的值,新的值将覆盖默认值*/
// 函数名:GetHttpObject(); // 作 用 1 : 创建XmlHttpRequest对象 // 作 用 2 : 判断浏览器类型 CallBackObject.prototype.GetHttpObject = function() { var xmlhttp; if (window.ActiveXObject) { try { xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } catch (E) { xmlhttp = false; } } } else { alert("不能创建XmlHttpRequest对象!浏览器不支持"); return xmlhttp; } if (!xmlhttp && typeof XMLHttpRequest != 'undefined') { try { xmlhttp = new XMLHttpRequest(); } catch (e) { xmlhttp = false; } } return xmlhttp;} // 函 数 名:DoCallBack(); // 作 用 1 :向指定的URL发送请求, // 作 用 2 :并且委托ReadyStateChange()函数去处理XmlHttpRequest对象状态变化 CallBackObject.prototype.DoCallBack = function(URL) { if( this.XmlHttp ) { if( this.XmlHttp.readyState == 4 || this.XmlHttp.readyState == 0 ) { var oThis = this; this.XmlHttp.open('POST', URL); this.XmlHttp.onreadystatechange = function() { oThis.ReadyStateChange(); }; this.XmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); this.XmlHttp.send(null); } }} //函 数 名:AbortCallBack(); //作 用:停止当前的请求 CallBackObject.prototype.AbortCallBack = function() { if( this.XmlHttp ) { this.XmlHttp.abort(); }} 创建一个显示Loading的Div层 var div; //函 数 名:OnLoading(); //作 用:XmlHttpRequest对象的状态为1(正在加载) CallBackObject.prototype.OnLoading = function() { div = document.createElement("DIV"); div.id = "div_TiShi"; div.innerHTML = '正在加载,请稍后.....'; div.onmousedown=function() {moveit(this)}; div.style.backgroundColor="yellow"; document.body.appendChild(div);} //函 数 名:OnLoading(); //作 用:XmlHttpRequest对象的状态为2(已加载) CallBackObject.prototype.OnLoaded = function() { div.style.display="none"; //window.alert('XmlHttpRequest对象已经加载...');} //函 数 名:OnInteractive(); //作 用:XmlHttpRequest对象的状态为3(交互中) CallBackObject.prototype.OnInteractive = function() { //window.alert('交互中...');} //函 数 名:OnComplete(); //作 用:XmlHttpRequest对象的状态为4(已经完成) CallBackObject.prototype.OnComplete = function(responseText, responseXml) { } //函 数 名:OnAbort(); //作 用:停止当前的请求 CallBackObject.prototype.OnError = function(status, statusText) { // Error window.alert('错误的XmlHttpRequest对象状态!');} //函 数 名:ReadyStateChange() //作 用: 用于判断XmlHttpRequest对象的状态码,分别进行处理 CallBackObject.prototype.ReadyStateChange = function() { if( this.XmlHttp.readyState == 1 ) { this.OnLoading(); } else if( this.XmlHttp.readyState == 2 ) { this.OnLoaded(); } else if( this.XmlHttp.readyState == 3 ) { this.OnInteractive(); } else if( this.XmlHttp.readyState == 4 ) { if( this.XmlHttp.status == 0 ) { this.OnAbort(); alert('XmlHttpRequest对象尚未初始化!'); } else if( this.XmlHttp.status == 200 && this.XmlHttp.statusText == "OK" ) { this.OnComplete(this.XmlHttp.responseText, this.XmlHttp.responseXML); } else { this.OnError(this.XmlHttp.status, this.XmlHttp.statusText, this.XmlHttp.responseText); } }} 根据不同的请求,和具体的异步交互,再对应的作修改. 下一次将用这个框架实现一个"加减乘除的简单计算",代码整理中......