首页 > 代码库 > js之第三方工具解析JSON
js之第三方工具解析JSON
1.JSON 只是一种文本字符串。它被存储在 responseText 属性中
2.利用第三方工具解析JSON
servlet服务处理:
jsp界面获取json数据:
为了读取存储在 responseText 属性中的 JSON 数据,需要根据 JavaScript 的 eval 函数。函数 eval 会把一个字符串当作它的参数。然后这个字符串会被当作 JavaScript 代码来执行。因为 JSON 的字符串就是由 JavaScript 代码构成的,所以它本身是可执行的
例如如下方式:
String json = "{username:'一叶扁舟',age:22}"; var json = xhr.responseText; json = eval("("+json+")"); alert(json.name);
2.利用第三方工具解析JSON
(1).需要导入的jar包
(2)代码实战:
domain实体类:
package com.wenhao.web.ajax.domain; /** *类的作用:City实体类 * * *@author 一叶扁舟 *@version 1.0 *@创建时间: 2014-10-28 下午05:57:18 */ //城市[JavaBean] public class City { private int id; private String cityName; public City(){} public City(int id, String cityName) { super(); this.id = id; this.cityName = cityName; } public int getId() { return id; } public void setId(int id) { this.id = id; } public String getCityName() { return cityName; } public void setCityName(String cityName) { this.cityName = cityName; } }
servlet服务处理:
package com.wenhao.web.ajax.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 net.sf.json.JSONArray; import net.sf.json.JsonConfig; import com.wenhao.web.ajax.domain.City; /** *类的作用:JavaBean直接转成JSON对象 *这个是json传输 * * *@author 一叶扁舟 *@version 1.0 *@创建时间: 2014-10-28 下午05:58:20 */ public class CityServlet extends HttpServlet { public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String province = request.getParameter("province"); byte[] buf = province.getBytes("ISO8859-1"); province = new String(buf,"UTF-8"); response.setContentType("text/html;charset=UTF-8"); PrintWriter pw = response.getWriter(); List<City> cityList = new ArrayList<City>(); String jsonString = null; if(province.equals("河南省")){ cityList.add(new City(1,"郑州")); cityList.add(new City(2,"洛阳")); cityList.add(new City(3,"开封")); cityList.add(new City(4,"信阳")); }else if(province.equals("福建省")){ cityList.add(new City(1,"福州")); cityList.add(new City(2,"厦门")); cityList.add(new City(3,"莆田")); cityList.add(new City(4,"漳州")); cityList.add(new City(5,"龙岩")); }else if(province.equals("云南省")){ cityList.add(new City(1,"大理")); cityList.add(new City(2,"昆明")); cityList.add(new City(3,"香格里拉")); } JsonConfig jsonConfig = new JsonConfig(); //json数据中不包含id属性 jsonConfig.setExcludes(new String[]{"id"}); //将cityList转成json数组 JSONArray jsonArray = JSONArray.fromObject(cityList,jsonConfig); jsonString = jsonArray.toString(); System.out.println("jsonString="+jsonString); pw.write(jsonString); } }
jsp界面获取json数据:
<%@ page language="java" pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> </head> <body> <select id="provinceID"> <option>选择省份</option> <option>河南省</option> <option>福建省</option> <option>云南省</option> </select> <select id="cityID"> <option>选择城市</option> </select> <script type="text/javascript"> document.getElementById("provinceID").onchange=function(){ //清空原city列表框 var citySelectElement = document.getElementById("cityID"); var cityElementArray = citySelectElement.options; var size = cityElementArray.length; if(size > 1){ //从后向前删除下拉列表框中的东西 for(var i=size-1;i>0;i--){ citySelectElement.removeChild(cityElementArray[i]); } } var province = this[this.selectedIndex].innerHTML; province = encodeURI(province); var xhr = createXHR(); xhr.onreadystatechange = function(){ if(xhr.readyState==4){ if(xhr.status==200){ //取得json字符串 var jsonString = xhr.responseText; //将json字符串转成json对象 var jsonObject = eval("("+jsonString+")"); var size = jsonObject.length; for(var i=0;i<size;i++){ var city = jsonObject[i].cityName; var optionElement = document.createElement("option"); optionElement.innerHTML = city; document.getElementById("cityID").appendChild(optionElement); } } } } xhr.open("get","/FirstAjax/CityServlet?time="+new Date().getTime()+"&province="+province); xhr.send(null); }; //创建一个ajax对象 function createXHR(){ var xhr = null; //如果是IE浏览器 if(window.ActiveXObject){ xhr = new ActiveXObject("microsoft.xmlhttp"); }else{ //非IE浏览器 xhr = new XMLHttpRequest(); } return xhr; } </script> </body> </html>
js之第三方工具解析JSON
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。