1.JSON 仅仅是一种文本字符串。它被存储在 responseText 属性中

为了读取存储在 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包

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTAxMTY2MjMyMA==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="">

(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>



測试效果图:



watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTAxMTY2MjMyMA==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="">

js之第三方工具解析JSON的更多相关文章

  1. 转:JS中生成和解析JSON

    原文地址:JS中生成和解析JSON 1.JS中生成JSON对象的方法: var json = []; var row1 = {}; row1.id= "1"; row1.name ...

  2. JS中生成和解析JSON

    1.JS中生成JSON对象的方法: var json = []; var row1 = {}; row1.id= "1"; row1.name = "jyy"; ...

  3. js写ajax并解析json

    function down(t){  var req = createRequest();  //创建request req.open("GET","selectWord ...

  4. linux使用jq工具解析json

    jq类似一个awk或grep一样的神器,可以方便地在命令行操作json 这里我使用海南万宁的天气接口做演示,地址:http://t.weather.sojson.com/api/weather/cit ...

  5. mac工具-解析json visualJSON和JSON Accelerator这两款工具

  6. js中eval详解,用Js的eval解析JSON中的注意点

    先来说eval的用法,内容比较简单,熟悉的可以跳过eval函数接收一个参数s,如果s不是字符串,则直接返回s.否则执行s语句.如果s语句执行结果是一个值,则返回此值,否则返回undefined. 需要 ...

  7. 用Js的eval解析JSON中的注意点

    在JS中将JSON的字符串解析成JSON数据格式,一般有两种方式: 1.一种为使用eval()函数. 2. 使用Function对象来进行返回解析. 使用eval函数来解析,并且使用jquery的ea ...

  8. 关于iOS中几种第三方对XML/JSON数据解析的使用

    Json XML 大数据时代,我们需要从网络中获取海量的新鲜的各种信息,就不免要跟着两个家伙打交道,这是两种结构化的数据交换格式.一般来讲,我们会从网络获取XML或者Json格式的数据,这些数据有着特 ...

  9. JS的全局函数eval解析JSON字符串

    JavaScript eval() 函数 定义和用法 eval() 函数可计算某个字符串,并执行其中的的 JavaScript 代码. 语法 eval(string) 参数 描述 string 必需. ...

随机推荐

  1. 从零开始学Xamarin.Forms(四) Android 准备步骤(添加第三方Xamarin.Forms.Labs库)

    原文:从零开始学Xamarin.Forms(四) Android 准备步骤(添加第三方Xamarin.Forms.Labs库)  1.安装对应dll     Update-Package Xama ...

  2. 分解XML方法

    分解XML方法 1.DOM生成和解析XML 2.SAX生成和解析XML 3.DOM4J生成和解析XML 4.JDOM生成和解析XML 版权声明:本文博主原创文章.博客,未经同意不得转载.

  3. 使用oracle数据库,多用户同时对一个表进行增加,删除,修改,查看等操作,会不会有影响?

    使用oracle数据库,多用户同时对一个表进行增加,删除,修改,查看等操作,会不会有影响? 1.问题:各操作间或者性能上会不会有影响? 如果有该如何解决? 多用户操作的影响主要是回锁定记录,oracl ...

  4. SQLSERVER图片查看工具SQL Image Viewer5.5.0.156

    原文:SQLSERVER图片查看工具SQL Image Viewer5.5.0.156 SQLSERVER图片查看工具SQL Image Viewer5.5.0.156 在2013年某一次北京SQL ...

  5. Unity入门

    Unity入门 用unity做一个最简单的交互.(相当于Hello World)仅仅要最后能执行就算入门了. 第一步,要先用三维制作软件制作出我们须要的场景. 这儿使用的是Max2012(软件大小3. ...

  6. 使用MVC写模式jsp连接到数据库操作

    首先用一个JavaBean封装数据库操作,即mvc中的模型 JdbcBean.java package data; import java.sql.*; public class JdbcBean { ...

  7. CentOS 安装memcached

    一,安装libevent 安装位置 /usr/lib #tar -zxvf libevent-2.0.21-stable.tar.gz # cdlibevent-2.0.21 # ./configur ...

  8. HDU 4777 Rabbit Kingdom(树状数组)

    HDU 4777 Rabbit Kingdom 题目链接 题意:给定一些序列.每次询问一个区间,求出这个区间和其它数字都互质的数的个数 #include <cstdio> #include ...

  9. 使用Emacs muse制作幻灯片

    PPT太受欢迎.总是必要的交流会议.我看到一个很酷javascript实现,取代PPT. 不过还是很喜欢Emacs要做的事,即使文件难听点. 现在,用muse slidy, 一大区别. 简单的说mus ...

  10. mybatis至mysql插入一个逗号包含值误差

    mybatis至mysql插入形如"11,22,33"当误差.我使用了错误的原因是美元符号镶嵌sql.正确的做法是使用#  有时间去看看mybatis的$和#差异. 版权声明:本文 ...