<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>My JSP 'index.jsp' starting page</title>
<script type="text/javascript"
src="http://code.jquery.com/jquery.min.js"></script>
<SCRIPT type="text/javascript">
$(document).ready(function(){
$("#send").click(function(){
var url = 'ajax.action'; //要請求的action
var params = { //傳遞的參數
username : $('#username').attr('value'),
password : $('#password').attr('value')
};
jQuery.post(url, params, myfun, 'json'); //jquery提供的ajax函數，myfun爲回調函數， 'json'爲返回的數據類型
});
function myfun(data){
var msg = $("#msg");
msg.html(data.msg).fadeIn();
setTimeout(
function(){
msg.fadeOut();
},1000
);
}
})
</SCRIPT>
<style type="text/css">
#msg{width:300px; height:50px; border:1px solid red; font-weight:900; display:none; text-align:center;}
</style>
</head>
<body>
username:
<input type='text' name='username' id="username" value="" />
<br>
password:
<input type='password' name="password" id="password" value="" />
<br />
<input type="button" value="submit" id="send"/><br/>
<div id="msg"></div>
</body>
</html>使用json，大概是能直接讀取action中屬性的值而不用想servlet中的out.print( ... )
package com.ajax.action;
import com.opensymphony.xwork2.ActionSupport;
public class AjaxAction extends ActionSupport {
private String username;//爲減少牌面，自行添加get，set方法
private String password;
private String msg;
public String execute() {
if(username.equals("admin") && password.equals("admin")){
msg = "hello, login successfully";
}else{
msg = "login fail";
}
return "success";
}
}
然後在配置xml文件,主要是設置result的type爲json，跟前面.post()中的dataType對應，還有就是要繼承json-default
<package name="ajax" namespace="/" extends="json-default">
<action name="ajax" class="com.ajax.action.AjaxAction">
<result type="json"></result>
</action>
</package>