Client: index.jsp
<script type="text/javascript" src="./js/jquery.js"></script>
<script type="text/javascript">
function checkUser()
{
var username = $("#username").val();
alert("Hello " + username);
//$.get("/TestAjax/AjaxServer?username=" + username, null, callback);
$.ajax({
type: 'POST',
url: '/TestAjax/AjaxServer',
data: "username=" + username, // 单引号和双引号对JS来说基本上没什么区别,
dataType: 'json', // text,xml... // 只是双引号里面不能再有双引号,可用单引号或转义符\'和"等。
success: callback
});
};
function callback(data)
{
alert("I\'m back " + data);
alert(data.message + " : " + data.name);
};
$(document).ready(function(){
$("#username").keypress(function (){if(event.keyCode==13){checkUser();}});
});
</script>
</head>
<body>
<input type="text" id="username"/>
<input type="button" value="Submit" οnclick="checkUser()"/>
</body>
</html>
Server: AjaxServer.java (servlet)
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
PrintWriter out = response.getWriter();
String username = request.getParameter("username");
//out.println("Hi Kitty " + username); text
// business logic
out.println("{\"name\":\"kevin\",\"message\":\"hello\"}");
}