迷失北京

          BlogJava 聯系 聚合 管理
            60 Posts :: 0 Stories :: 13 Comments :: 0 Trackbacks

                今天稍微學習了一下Json,JSON (JavaScript Object Notation) 是一種輕量級的數據交換格式。 易于人閱讀和編寫。同時也易于機器解析和生成。 JSON采用完全獨立于語言的文本格式,但是也使用了類似于C語言家族的習慣(包括C, C++, C#, Java, JavaScript, Perl, Python等)。 這些特性使JSON成為理想的數據交換語言。

          JSON建構于兩種結構:

          • “名稱/值”對的集合(A collection of name/value pairs)。不同的語言中,它被理解為對象(object) ,紀錄(record),結構(struct),字典(dictionary),哈希表(hash table),有鍵列表(keyed list),或者關聯數組 (associative array)。
          • 值的有序列表(An ordered list of values)。在大部分語言中,它被理解為數組(array)。

          這些都是常見的數據結構。事實上大部分現代計算機語言都以某種形式支持它們。這使得一種數據格式在同樣基于這些結構的編程語言之間交換成為可能。

          JSON具有以下這些形式:

          對象是一個無序的“‘名稱/值’對”集合。一個對象以“{”(左括號)開始,“}”(右括號)結束。每個“名稱”后跟一個“:”(冒號);“‘名稱/值’ 對”之間使用“,”(逗號)分隔。

                好了還是不說廢話了直接上例子吧??!這個小demo的設計是這樣的,index.jsp頁面訪問服務器端的servlet,servlet向index.jsp傳遞數據,傳遞的數據時Json格式的,呵呵...廢話,如果不是Json格式的數據我寫這篇博客就相當于蒙騙觀眾了!

          index.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>My JSP 'index.jsp' starting page</title>
          <meta http-equiv="pragma" content="no-cache">
          <meta http-equiv="cache-control" content="no-cache">
          <meta http-equiv="expires" content="0">
          <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
          <meta http-equiv="description" content="This is my page">
          <!--
          <link rel="stylesheet" type="text/css" href="styles.css" mce_href="styles.css">
          -->
          <mce:script type="text/javascript" src="js/jquery-1.3.2.js" mce_src="js/jquery-1.3.2.js"></mce:script>
          <mce:script type="text/javascript" src="js/login.js" mce_src="js/login.js"></mce:script>
          </head>
          <body>
          <table>
          <tr id="head">
          <td>lastname</td>
          <td>firstname</td>
          <td>address</td>
          </tr>
          <tr id="tr0">
          <td id="td0"></td>
          <td id="td1"></td>
          <td id="td2"></td>
          </tr>
          <tr id="tr1">
          <td id="td0"></td>
          <td id="td1"></td>
          <td id="td2"></td>
          </tr>
          <tr id="tr2">
          <td id="td0"></td>
          <td id="td1"></td>
          <td id="td2"></td>
          </tr>
          </table>
          </body>
          </html>


          然后是兩個bean程序:Person和Address。這里設計這兩個類主要是更好的體現Json傳遞數據的方式和傳遞的數據格式

          package com.wk;
          public class Person {
          private String firstName;
          private String lastName;
          private Address address;
          public Person() {
          super();
          }
          public Person(String firstName, String lastName, Address address) {
          super();
          this.firstName = firstName;
          this.lastName = lastName;
          this.address = address;
          }
          public String getFirstName() {
          return firstName;
          }
          public void setFirstName(String firstName) {
          this.firstName = firstName;
          }
          public String getLastName() {
          return lastName;
          }
          public void setLastName(String lastName) {
          this.lastName = lastName;
          }
          public Address getAddress() {
          return address;
          }
          public void setAddress(Address address) {
          this.address = address;
          }
          }
          package com.wk;
          public class Address {
          private int id;
          private String detail;
          public Address() {
          super();
          }
          public Address(int id, String detail) {
          super();
          this.id = id;
          this.detail = detail;
          }
          public int getId() {
          return id;
          }
          public void setId(int id) {
          this.id = id;
          }
          public String getDetail() {
          return detail;
          }
          public void setDetail(String detail) {
          this.detail = detail;
          }
          }


          servlet代碼:

          package com.servlet;
          import java.io.IOException;
          import java.io.PrintWriter;
          import java.util.ArrayList;
          import java.util.List;
          import javax.servlet.ServletException;
          import javax.servlet.http.HttpServlet;
          import javax.servlet.http.HttpServletRequest;
          import javax.servlet.http.HttpServletResponse;
          import com.wk.Address;
          import com.wk.Person;
          public class PersonServlet extends HttpServlet{
          private static final long serialVersionUID = 1L;
          static StringBuffer bf;
          @Override
          protected void doGet(HttpServletRequest req, HttpServletResponse resp)
          throws ServletException, IOException {
          resp.setContentType(
          "text/html;charset=utf-8");
          List
          <Person> persons = new ArrayList<Person>();
          PrintWriter
          out = resp.getWriter();

          Person person1
          = new Person();
          Address a1
          = new Address();
          a1.setId(
          1);
          a1.setDetail(
          "河北省");
          person1.setFirstName(
          "");
          person1.setLastName(
          "");
          person1.setAddress(a1);
          persons.add(person1);

          Person person2
          = new Person();
          Address a2
          = new Address();
          a2.setId(
          2);
          a2.setDetail(
          "江西省");
          person2.setFirstName(
          "");
          person2.setLastName(
          "");
          person2.setAddress(a2);
          persons.add(person2);

          Person person3
          = new Person();
          Address a3
          = new Address();
          a3.setId(
          1);
          a3.setDetail(
          "湖南省");
          person3.setFirstName(
          "");
          person3.setLastName(
          "");
          person3.setAddress(a3);
          persons.add(person3);

          bf
          = new StringBuffer();

          /* 組裝成json格式的字符串
          * {"person":[
          * {"firstname":"", "lastNmae":"", "address": {"id":"", "detail":""}},
          * ]}
          */
          bf.append(
          "{\"person\":[");
          for(Person person : persons) {
          bf.append(
          "{\"firstname\":\"").append(person.getFirstName()).append("\",\"").
          append(
          "lastname\":\"").append(person.getLastName()).append("\",").
          append(
          "\"address\":").append("{\"id\":\"").append(person.getAddress().getId()).append("\",\"").
          append(
          "detail\":\"").append(person.getAddress().getDetail()).append("\"").append("}},");
          }
          //將最后一個逗號去掉
          int length = bf.length();
          String newStr
          = bf.substring(0, length-1);
          bf
          = new StringBuffer();
          bf.append(newStr);

          bf.append(
          "]}");
          out.println(bf);
          }
          @Override
          protected void doPost(HttpServletRequest req, HttpServletResponse resp)
          throws ServletException, IOException {
          this.doGet(req, resp);
          }

          }


          下面的代碼就是Jquery如何解析Json數據了,也是這一個demo的核心代碼了:

          $(document).ready(function() {
          $(
          "table").css("border-color", "lightblue").css("border-style", "solid");
          $(
          "#head").css("background-color", "lightblue");
          $.ajax({
          // 后臺處理程序
          url : "Json",
          // 數據發送方式
          type : "post",
          // 接受數據格式
          dataType : "json",
          timeout :
          20000,// 設置請求超時時間(毫秒)。
          // 請求成功后回調函數。
          success : function(dataObj) {
          var member
          = eval(dataObj);
          // alert(member.person[1].firstname);
          $(dataObj.person).each(function(i, per) {
          $(
          "#tr" + i).find("#td0").html(per.lastname);
          $(
          "#tr" + i).find("#td1").html(per.firstname);
          $(
          "#tr" + i).find("#td2")
          .html(per.address.detail);
          });
          }
          });
          });


          再貼一個運行效果吧??!

          呵呵....共同學習共同進步!!!!!!!

          posted on 2011-03-20 17:48 王康 閱讀(266) 評論(0)  編輯  收藏

          只有注冊用戶登錄后才能發表評論。


          網站導航:
           
          主站蜘蛛池模板: 兖州市| 清新县| 平谷区| 安远县| 天长市| 陈巴尔虎旗| 土默特左旗| 昌宁县| 上虞市| 西昌市| 邛崃市| 秭归县| 犍为县| 大方县| 泰宁县| 枞阳县| 林西县| 嘉峪关市| 墨玉县| 佛坪县| 清水县| 嘉黎县| 上饶市| 石家庄市| 昭通市| 哈尔滨市| 信阳市| 馆陶县| 开平市| 军事| 益阳市| 西乡县| 原平市| 南乐县| 贵定县| 西乌| 金坛市| 浦城县| 荔波县| 榕江县| 子长县|