ajax.js

/*
* AJAX通讯辅助类
* 
* <p>
*    使用方法:<br/>
*    <script type="text/javascript" src="<%=request.getContextPath()%>/script/ajax.js"></script> 
  <script type="text/javascript">
   function getJSPInfo(id){
   var ajax=new AjaxObject();
   ajax.onComplete=function(responseText, responseXml){
    document.getElementById("right").innerHTML=responseText;
   }
   ajax.send("ajax_jsp.do","id="+id,"POST",true);
  }
  </script>
* </P>
* 
* 
*/
function AjaxObject() {
this.XmlHttp = this.getHttpObject();
}
AjaxObject.prototype.getHttpObject = function () {
var xmlhttp = false;
if (window.XMLHttpRequest) {
  xmlhttp = new XMLHttpRequest();
} else {
  if (window.ActiveXObject) {
   try {
    xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
   }
   catch (e) {
    try {
     xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    catch (e) {
     alter("create ajax object faild!");
    }
   }
  }
}
return xmlhttp;
};
/**
  说明:AJAX通讯回调函数
参数说明：
URL:   通讯URL地址
  CONTENT: 通讯所用数据信息
  METHOD:  GETPOST
  TYPE:  truefalse异步提交方式
  
*/
AjaxObject.prototype.send = function (URL, CONTENT, METHOD, TYPE) {
if (METHOD == "" || METHOD == null || METHOD.toUpperCase() != "POST") {
  METHOD = "GET";
} else {
  METHOD = "POST";
}
if (TYPE == "" || TYPE == null || TYPE != true) {
  TYPE = false;
} else {
  TYPE = true;
}
if (CONTENT == "") {
  CONTENT = null;
}
if (this.XmlHttp) {
  if (this.XmlHttp.readyState == 4 || this.XmlHttp.readyState == 0) {
   var oThis = this;
   this.XmlHttp.open(METHOD, URL, TYPE);
   this.XmlHttp.onreadystatechange = function () {
    oThis.readyStateChange();
   };
   if (METHOD.toUpperCase() == "POST") {
    this.XmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
   }
   this.XmlHttp.send(CONTENT);
  }
}
};
AjaxObject.prototype.abortCallBack = function () {
if (this.XmlHttp) {
  this.XmlHttp.abort();
}
};
/*
* 正在加载过程
*/
AjaxObject.prototype.onLoading = function () {
  // Loading
};
/*
* 加载完成
*/
AjaxObject.prototype.onLoaded = function () {
  // Loaded
};
/*
* 请求就绪
*/
AjaxObject.prototype.onInteractive = function () {
  // Interactive
};
/*
* 请求完成
*/
AjaxObject.prototype.onComplete = function (responseText, responseXml) {
  // Complete
};
/*
  * 清求无效
  */
AjaxObject.prototype.onAbort = function () {
  // Abort
};
/*
  * 请求错误
  */
AjaxObject.prototype.onError = function (status, statusText, responseText) {
  // Error
};
AjaxObject.prototype.readyStateChange = function () {
if (this.XmlHttp.readyState == 1) {
  this.onLoading();
  return;
} else {
  if (this.XmlHttp.readyState == 2) {
   this.onLoaded();
   return;
  } else {
   if (this.XmlHttp.readyState == 3) {
    this.onInteractive();
    return;
   } else {
    if (this.XmlHttp.readyState == 4) {
     if (this.XmlHttp.status == 0) {
      this.onAbort();
     } 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);
      }
     }
    }
   }
  }
}
};

具体使用例子：

function showPeriodinfo(){
	//var iWidth = window.screen.availWidth-800;
    //var iHeight = window.screen.availHeight-500; 
    var periodTypeNo = document.getElementById("ebegToEnd").value;
    var productCode = document.getElementById("productCode").value;
	//if(periodTypeNo!= null&&periodTypeNo!="00"){
	//	WinPop('${root}/product.do?method=showPeriodTypeInfo&productcode='+productCode+'&periodTypeNo='+periodTypeNo, '',iWidth,iHeight,'0','0');
	//}else{
	//    alert("请选择一个待查看的XXX类型！");
	//}
	var ajax=new AjaxObject();
	ajax.onComplete=function(responseText, responseXml){
		var typevalue =responseText;
		if(typevalue == null  || typevalue ==""){ 
		  alert("xxx描述为空！");
		  document.getElementById("showDesc").style.display = "";
		  document.getElementById("periodDesc").innerHTML = "";
		  periodTypeNo.focus();
		}
		else{
		    document.getElementById("showDesc").style.display = "";
			document.getElementById("periodDesc").innerHTML = typevalue;
		}
	}
	if(periodTypeNo!= null&&periodTypeNo!="00"){
		ajax.send("${root}/product.do","method=showPeriodTypeInfo&productcode="+productCode+"&periodTypeNo="+periodTypeNo,"POST",true);	
	}else{
		alert("请选择一个待查看的XXX类型！");
	}
}

   <td>
     <html:select property="ebegToEnd"  value="${period}" οnchange="showPeriodinfo();">
      <logic:iterate id="tconstant" name="periodList" scope="request">
       <html:option value="${tconstant.id.constantId}">${tconstant.constantValue1}</html:option>
      </logic:iterate>
     </html:select>
    </td>