本程序对ajax的一些基础调用进行了封装,使用者只要实现具体的事件驱动程序就可以
了,如本例子的doTest.js, 然后把该文件引进相对应的jsp文件里面,如test.jsp
test.jsp
<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<script src="ajaxjs/ajaxInit.js" type="text/javascript"></script>
<script src="ajaxjs/doTest.js" type="text/javascript"></script>
<html>
<body>
<input name="testText" type="text" value="">
<input type="button" value="test" onclick="doTestRequest(document.getElementById('testText').value,'jgaopass','doTestAfterRequest','responseText');">
</body>
</html>
doTest.js
//测试函数
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
/**
* 请求
* doAfterRequestMethodName 请求成功后的要执行的函数名称
* responseTypeName ajax异步调用后返回的内容的类型,可以使responseText或者responseXml
*/
function doTestRequest(userName, userPwd, doAfterRequestMethodName, responseTypeName){
var param = setQueryString('userName',userName,'userPwd',userPwd);
sendRequest('toStrutsAjaxTest.do',param,doAfterRequestMethodName,responseTypeName);
}
//请求成功后的执行内容
function doTestAfterRequest(responseString){
var teststring = document.getElementById("testText");
teststring.value = responseString;
}
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
ajaxInit.js
//全局变量
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
var xmlHttp = false;
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//公共函数
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//创建XMLHttpRequest对象
function createXMLHttpRequest() {
if (window.XMLHttpRequest) {//Mozilla 等浏览器
xmlHttp = new XMLHttpRequest();
} else {
if (window.ActiveXObject) {// IE浏览器
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e) {
try {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e) {
}
}
}
}
if (xmlHttp.overrideMimeType) {//修改MiME类型
xmlHttp.overrideMimeType("text/xml");
}
if (!xmlHttp) {//创建XMLHttpRequest失败
window.alert("创建XMLHttpRequest失败");
return false;
}
}
//向后台发送请求的参数设置
function setQueryString(){
var param="";
for(var i=0;i<arguments.length;i++){
param+=arguments[i]+'='+encodeURI(arguments[i+1]);
if(i!=arguments.length-2){
param+="&";
i++;
}else{
break;
}
}
return param;
}
/**
* 发送请求
* doAfterRequestMethodName 请求成功后的要执行的函数名称
* responseTypeName ajax异步调用后返回的内容的类型,可以使responseText或者responseXml
*/
function sendRequest(requestUrl,param,doAfterRequestMethodName,responseTypeName){
createXMLHttpRequest();
xmlHttp.open('POST',requestUrl,true);
xmlHttp.setrequestheader("content-type","application/x-www-form-urlencoded");
xmlHttp.onreadystatechange= function(){regCallBack(doAfterRequestMethodName,responseTypeName);};
xmlHttp.send(param);
}
//回调函数
function regCallBack(doAfterRequestMethodName,responseTypeName){
if(xmlHttp.readyState == 4){
if(xmlHttp.status == 200){
doAfterRequest(doAfterRequestMethodName,responseTypeName);
}
}
}
//请求成功后的执行函数
function doAfterRequest(doAfterRequestMethodName,responseTypeName){
var responseString = "";
if (responseTypeName!=null){
if (responseTypeName == "responseText"){
responseString = xmlHttp.responseText;
}
if (responseTypeName == "responseXml"){
responseString = xmlHttp.responseXml;
}
}
if(doAfterRequestMethodName!=null){
eval(doAfterRequestMethodName+"('"+responseString+"')");
}
}
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
struts-config.xml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE struts-config PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 1.1//EN" "
http://jakarta.apache.org/struts/dtds/struts-config_1_1.dtd
">
<struts-config>
<data-sources />
<form-beans />
<global-exceptions />
<global-forwards />
<action-mappings >
<action path="/toStrutsAjaxTest" type="com.jgao.ajax.test.struts.action.ToStrutsAjaxTestAction">
</action>
</action-mappings>
<message-resources parameter="com.yourcompany.struts.ApplicationResources" />
</struts-config>
ToStrutsAjaxTestAction.java
//Created by MyEclipse Struts
// XSL source (default): platform:/plugin/com.genuitec.eclipse.cross.easystruts.eclipse_4.1.0/xslt/JavaClass.xsl
package com.jgao.ajax.test.struts.action;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts.action.Action;
import org.apache.struts.action.ActionForm;
import org.apache.struts.action.ActionForward;
import org.apache.struts.action.ActionMapping;
/**
* MyEclipse Struts
* Creation date: 09-18-2006
*
* XDoclet definition:
* @struts.action validate="true"
*/
public class ToStrutsAjaxTestAction extends Action {
// --------------------------------------------------------- Instance Variables
// --------------------------------------------------------- Methods
/**
* Method execute
* @param mapping
* @param form
* @param request
* @param response
* @return ActionForward
* @throws IOException
*/
public ActionForward execute(
ActionMapping mapping,
ActionForm form,
HttpServletRequest request,
HttpServletResponse response) throws IOException {
String teststring = request.getParameter("userName");
teststring = teststring + "ok";
response.getWriter().write(teststring);
return null;
}
}