提交數據使用json代替xml
??? 頁面:jsonExample.jsp
<%@ page contentType="text/html; charset=GBK" %>
<html>
<head>
<title>
JSON示例
</title>
<script type="text/javascript" src="zxml.src.js"></script>
<script type="text/javascript" src="json.js"></script>
<script type="text/javascript">
?var xmlHttp;
???????
??????? //創建對象
??????? function createXMLHttpRequest(){
??????? ?xmlHttp = zXmlHttp.createRequest();
??????? }
???????
??????? function doJSON(){
????????? ?//得到Car對象
??????? ?var car = getCarObject();
???????????????
??????????????? //用JSON字符串化car對象
??????????????? var carAsJSON = car.toJSONString();
??????????????? alert("汽車對象JSON化為:\n" + carAsJSON);
???????????????
??????????????? var url = "JSONExample?timeStamp=" + new Date().getTime();
???????????????
??????????????? //創建對象
??????????????? createXMLHttpRequest();
??????????????? xmlHttp.open("POST",url,true);
??????????????? xmlHttp.onreadystatechange = handleStateChange;
??????????????? xmlHttp.setRequestHeader("Content-Type","application/x-www-form.urlencoded");
??????????????? xmlHttp.send(carAsJSON);
??????? }
???????
??????? //回調方法
??????? function handleStateChange(){
??????? ?if (xmlHttp.readyState == 4){
??????????????? ?if (xmlHttp.status == 200){
??????????????????????? ?parseResults();
??????????????????????? }
??????????????? }
??????? }
???????
??????? //解析結果
??????? function parseResults(){
??????? ?var responseDiv = document.getElementById("serverResponse");
??????????????? if (responseDiv.hasChildNodes()){
??????????????? ?responseDiv.removeChild(responseDiv.childNode[0]);
??????????????? }
???????????????
??????????????? var responseText = document.createTextNode(xmlHttp.responseText);
??????????????? responseDiv.appendChild(responseText);
??????? }
???????
??????? //得到Car對象
??????? function getCarObject(){
??????? ?return new Car("Dodge","Coronet R/T",1968,"yellow");
??????? }
???????
???????
??????? //Car構造函數
??????? function Car(make,model,year,color){
??????? ?this.make = make;
??????????????? this.model = model;
??????????????? this.year = year;
??????????????? this.color = color;
??????? }
</script>
</head>
<body>
<br /><br />
<form action="#">
? <input type="button" value="發送JSON數據" onclick="doJSON();"/>
</form>
<h2>
? 服務器響應:
</h2>
<div id="serverResponse">
</div>
</body>
</html>
??? 服務器:JSONExample.java
package ajaxbook.chap4;
import java.io.*;
import java.net.*;
import java.text.ParseException;
import javax.servlet.*;
import javax.servlet.http.*;
import org.json.JSONObject;
public class JSONExample
??? extends HttpServlet {
? //處理Post方法
? protected void doPost(HttpServletRequest request,
??????????????????????? HttpServletResponse response) throws ServletException,
????? IOException {
??? String json = readJSONStringFromRequestBody(request);
??? //使用JSON綁字Ajax對象
??? JSONObject jsonObject = null;
??? try {
????? jsonObject = new JSONObject(json);
??? }
??? catch (ParseException pe) {
????? System.out.println("ParseException: " + pe.toString());
??? }
??? //返回輸出結果
??? String responseText = "You have a " + jsonObject.getInt("year") + " "
??????? + jsonObject.getString("make") + " " + jsonObject.getString("model")
??????? + " " + " that is " + jsonObject.getString("color") + " in color.";
??? response.setContentType("text/xml");
??? response.getWriter().print(responseText);
? }
? //得到參數
? private String readJSONStringFromRequestBody(HttpServletRequest request) {
??? StringBuffer json = new StringBuffer();
??? String line = null;
??? try {
????? BufferedReader reader = request.getReader();
????? while ( (line = reader.readLine()) != null) {
??????? json.append(line);
????? }
??? }
??? catch (Exception e) {
????? System.out.println("Error reading JSON string: " + e.toString());
??? }
??? return json.toString();
? }
}
?
注意:要引入json.js和json的源文件,使用json.jar不行,源文件參見書籍源代碼第三章
參考:Ajax基礎教程? 作筆記吧?
Trackback: http://tb.blog.csdn.net/TrackBack.aspx?PostId=975204
posted on 2006-12-31 16:52
SIMONE 閱讀(2084)
評論(0) 編輯 收藏 所屬分類:
JSP 、
AJAX