聲明:這是轉帖的javascript
原帖地址:http://hi.baidu.com/fuzk2008/blog/item/de586ed2556c77133bf3cf65.htmlhtml
1、搭建struts2環境。java
無非就是web.xml、struts.xml文件的配置,添加struts2所須要的jar包。
web
2、配置json環境。apache
下載jsonplugin.jar(我用的是jsonplugin-0.30.jar)、json.js、prototype.js。json
並將jsonplugin.jar放到/WebRoot/WEB-INF/lib目錄下,json.js、prototype.js放到/WebRoot/script目錄下。app
3、程序目錄結構及源碼。jsp
一、目錄結構async
二、web.xml:函數
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5"
xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
<filter>
<filter-name>struts2</filter-name>
<filter-class>
org.apache.struts2.dispatcher.FilterDispatcher
</filter-class>
</filter>
<filter-mapping>
<filter-name>struts2</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
<welcome-file-list>
<welcome-file>login.jsp</welcome-file>
</welcome-file-list>
</web-app>
三、struts.xml:
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
"http://struts.apache.org/dtds/struts-2.0.dtd">
<struts>
<constant name="struts.i18n.encoding" value="UTF-8" />
<package name="default" extends="json-default">
<action name="validateName" class="org.fuzk.demo.ValidateNameAction" >
<result type="json" />
</action>
</package>
</struts>
在struts.xml文件中有兩個值得注意的地方:
第一個地方是配置 struts.i18n.encoding 常量時,再也不是使用 GBK 編碼,而是 UTF-8 編碼,這是
由於 Ajax 的POST 請求都是以 UTF-8的方式進行編碼的。
第二個地方是配置包時,本身的包繼承了 json-default 包,而再也不繼承默認的 default 包,這是
由於只有在該包下才有 json 類型的Result。
三、login.jsp
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>struts2&json</title>
<script type="text/javascript" src="script/json.js" ></script>
<script type="text/javascript" src="script/prototype.js"></script>
<script language="JavaScript" >
function validateName() {
var url = 'validateName.action';
var params = Form.Element.serialize('userBean.userName');
var myAjax = new Ajax.Request(
url,
{
method:'post',
parameters:params,
onComplete:processResponse,
asynchronous:true
});
}
function processResponse(request) {
var jsonObje = eval('('+request.responseText+')'); //此處也能夠爲var jsonObje = request.responseText.parseJSON(); parseJSON()
//函數在json.js文件中定義
$("tip").innerHTML = jsonObje.tip;
$("tip2").innerHTML = '歡迎您,'+jsonObje.userBean.userName; //此處在《struts2入門教程.pdf》中爲$("tip2").innerHTML='歡迎
//您,'+JSON.stringify(jsonObje.userBean.name);
}
</script>
</head>
<body>
<span id="tip" style="color: red; font-weight: bold" ></span>
<br/>
<span id="tip2" style="color: red; font-weight: bold" ></span>
<form action="" method="post" name="form">
<fieldset>
<legend>
用戶登陸
</legend>
<p align="center">
賬 號:
<input type="text" name="userBean.userName" οnblur="validateName();" />
</p>
</fieldset>
</form>
</body>
</html>
四、ValidateNameAction.java
package org.fuzk.demo;
import com.googlecode.jsonplugin.annotations.JSON;
import com.opensymphony.xwork2.ActionSupport;
public class ValidateNameAction extends ActionSupport {
private UserBean userBean;
private String tip;
@JSON
public UserBean getUserBean() {
return userBean;
}
public void setUserBean(UserBean userBean) {
this.userBean = userBean;
}
@JSON
public String getTip() {
return tip;
}
public void setTip(String tip) {
this.tip = tip;
}
public String execute() {
try {
if ( validateName(userBean)) {
tip = "你好!" + userBean.getUserName() + ", 這個用戶名可用!";
// tip = "Hello!" + userBean.getUserName() + ",this username is OK!";
} else {
tip = "系統中已有" + userBean.getUserName() + "用戶名,請從新選擇一個!";
// tip = "Sorry, "+userBean.getUserName()+" is used. Please choose other.";
}
} catch ( Exception e) {
tip = e.getMessage();
}
return SUCCESS;
}
public boolean validateName( UserBean userBean) {
if ( "fuzk".equals(userBean.getUserName()))
return false;
else
return true;
}
}
五、UserBean.java
package org.fuzk.demo;
public class UserBean {
private String userName;
public String getUserName() {
return userName;
}
public void setUserName(String userName) {
this.userName = userName;
}
}
4、遇到的問題
在調試過程當中遇到一個問題,就是在function processResponse(request) 函數中,request.responseText的值被截斷,致使程序執行失敗。將ValidateNameAction.java文件中的tip值修改爲英文字符串時,則執行成功。由此認爲是編碼問題。接着查找資料,修改編碼方式。將struts.xml文件中的編碼方式修改成utf-8,將整個項目的編碼方式修改成utf-8。最終仍是不行,看來不徹底是編碼問題。繼續在網上查找資料,說是jsonplugin.jar版本問題,因而下了一個jsonplugin-0.30.jar,替換掉原來用的jsonplugin-0.7.jar,問題解決!
另外,本文中紅色字體標註位置按照教程中的寫法也有問題,程序在此處執行失敗,查找資料後,修改成如今的代碼,執行成功。