`
jayyanzhang2010
  • 浏览: 377903 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

用JQuery解析Json

jsonjQueryMobileServletXML 
阅读更多
如果想解析JSON，服务器端最好是是去下载针对不同开发软件，有不同的类库，利用类库在服务器端生成JSON格式的数据也就不显得太麻烦了。

步骤：
1.因为我用JAVA开发，所以首先去要下载JSON的类库，我用的是http://www.sf.net提供的json类库。


而json类库以信赖于几个其它的类库，下面把所需要的类截个图记录。





2.写服务器商程序，返回一个JSON格式的数据.

package cn.limaoyuan.jquery.xml; 

import java.io.IOException; 
import java.io.PrintWriter; 
import javax.servlet.ServletException; 
import javax.servlet.http.HttpServlet; 
import javax.servlet.http.HttpServletRequest; 
import javax.servlet.http.HttpServletResponse; 

public class JqueryServletForXml extends HttpServlet { 

public void doGet(HttpServletRequest request, HttpServletResponse response) 
throws ServletException, IOException { 
System.out.println("into JqueryServletForXml"); 
response.setContentType("text/xml"); 
response.setCharacterEncoding("gbk"); 
String xml = "<?xml version=\"1.0\" encoding=\"gbk\"?>&ltuserlist>" + 
"&ltuser>&ltname&gtlimy_1</name>&ltage&gt25_1</age></user>" + 
"&ltuser>&ltname&gtlimy_2</name>&ltage&gt25_2</age></user>" + 
"&ltuser name=\"limy_3\" age=\"25_3\"></user>" + 
"&ltuser name=\"limy_4\" age=\"25_4\"></user></userlist>"; 
response.getWriter().println(xml); 
} 

public void doPost(HttpServletRequest request, HttpServletResponse response) 
throws ServletException, IOException { 
doGet(request, response); 
} 
}
3.其中需要一个User类

package cn.limaoyuan.jquery.json; 

public class User { 
private String name; 
private int age; 
private String address; 
private String phone; 
private String mobile; 

public String getAddress() { 
return address; 
} 
public void setAddress(String address) { 
this.address = address; 
} 
public int getAge() { 
return age; 
} 
public void setAge(int age) { 
this.age = age; 
} 
public String getMobile() { 
return mobile; 
} 
public void setMobile(String mobile) { 
this.mobile = mobile; 
} 
public String getName() { 
return name; 
} 
public void setName(String name) { 
this.name = name; 
} 
public String getPhone() { 
return phone; 
} 
public void setPhone(String phone) { 
this.phone = phone; 
}  
}
4.前面页面

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<title&gtStripingTable</title>
<style type="text/css">
<!-- 
*.*{ 
font-size: 12px; 
} 
-->
</style>

<script type="text/javascript" src="jquery-1.2.1.js"></script>
<script type="text/javascript" src="loadxml.js"></script>
<script type="text/javascript">
<!-- 
$(document).ready(function(){}); 

function getAjaxByJson(){ 
$("#info").ajaxStart(function(){ 
$(this).attr("innerHTML","开始加载!"); 
}); 

$("#info").ajaxError(function(request, settings){ 
$(this).attr("innerHTML","出错页面:" + settings.url); 
}); 

$("#info").ajaxSuccess(function(){ 
$(this).attr("innerHTML","加载完成!"); 
});


//1.如果返回的是JSONArray对象，那么用下面的方法打出来值 
/* 
$.getJSON("../servlet/JqueryServletForJson",{t:new Date()},function(data){ 
var len = $(data).length; 
for(var i=0;i&ltlen;i++){ 
$("#responseText").append($(data).get(i)+","); 
} 
}); 
*/ 

//2.如果返回的是JSONObject对象,无论是返回通过Map构造的还是JavaBean构造的 
/* 
$.getJSON("../servlet/JqueryServletForJson",{t:new Date()},function(data){ 
var name = data.name; 
var age = data.age; 
var address = data.address; 
var phone = data.phone; 
var mobile = data.mobile; 

$("#responseText").append("name: " + name +", age: " + age + 
", address: " + address+", phone: " + phone + ", mobile: " + mobile); 
}); 
*/ 

//3.返回嵌套的json对象 
$.getJSON("../servlet/JqueryServletForJson",{t:new Date()},function(data){ 
$("#responseText").append("&ltbr/>用户信息&ltbr/>&lthr/>"); 
for(var i=0;i&ltdata.user.length;i++){ 
var user = data.user[i]; 
$("#responseText").append("name: " + user.name +", age: " + user.age + 
", address: " + user.address+", phone: " + user.phone + ", mobile: " + user.mobile + " &ltbr/>"); 
} 

$("#responseText").append("&ltbr/>经理信息&ltbr/>&lthr/>"); 
for(var i=0;i&ltdata.manager.length;i++){ 
var manager = data.manager[i]; 
$("#responseText").append("name: " + manager.name +", age: " + manager.age + 
", address: " + manager.address+", phone: " + manager.phone + ", mobile: " + manager.mobile + " &ltbr/>"); 
} 

}); 


}  

-->
</script>
</head>
<body>
<input type="button" value="测试服务器回传json" onclick="getAjaxByJson()"/>
<div id="responseText"></div>
<div id="info"></div>
</bdoy>
</html>
5.web.xml

<servlet-mapping> 
<servlet-name&gtJqueryServlet</servlet-name> 
<url-pattern>/servlet/JqueryServlet</url-pattern> 
</servlet-mapping> 
<servlet-mapping> 
<servlet-name&gtJqueryServletForXml</servlet-name> 
<url-pattern>/servlet/JqueryServletForXml</url-pattern> 
</servlet-mapping> 
<servlet-mapping> 
<servlet-name&gtJqueryServletForJson</servlet-name> 
<url-pattern>/servlet/JqueryServletForJson</url-pattern> 
</servlet-mapping>
分享到：
| jQuery使用JSON的例子
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    用jquery解析JSON数据的方法

    用jquery解析JSON数据的方法,作为jquery异步请求的传输对象，jquery请求后返回的结果是json对象,这里考虑的都是服务器返回JSON形式的字符串的形式，对于利用JSONObject等插件封装的JSON对象，与此亦是大同小异，这里...

    使用JQUery解析JSON字符串

    在IT行业中，JavaScript库jQuery是前端开发中...以上就是关于“使用jQuery解析JSON字符串”这一主题的详细讲解，涵盖了JSON的基础知识、jQuery的解析方法以及动态更新DOM的内容。希望对您在实际项目中的应用有所帮助。

    用jquery解析JSON数据的方法20110227

    2. **使用jQuery的内置函数解析JSON**： 如果jQuery异步请求（例如`$.ajax`、`$.get`或`$.post`）设置了`dataType`参数为"json"，或者使用`$.getJSON()`方法，jQuery会自动将响应数据解析为JavaScript对象，无需...

    Jquery解析json

    ### Jquery解析json #### 知识点概览 1. **JSON介绍** 2. **jQuery与JSON数据交互** 3. **Struts2框架简介** 4. **JSON类库的选择与使用** 5. **服务器端Java程序编写** 6. **前端jQuery解析JSON数据** #### JSON...

    Jquery解析Json数据，实现级联菜单

    本主题将深入探讨如何使用jQuery解析JSON数据并实现级联菜单，这在构建动态和交互性强的用户界面时非常常见。级联菜单通常用于导航，其中下拉选项根据上一个选项的选择而变化，提供更具体的子类别。 首先，让我们...

    Jquery解析Json数据

    在本话题中，我们将深入探讨如何使用jQuery解析JSON数据，这在现代Web应用中是一个非常重要的技能，因为JSON（JavaScript Object Notation）已经成为数据交换的标准格式。 JSON是一种轻量级的数据交换格式，它易于...

    Jquery.json.js

    在早期版本的jQuery中，`jQuery.parseJSON()`函数用于将JSON字符串解析为JavaScript对象。然而，随着JSON支持成为JavaScript语言标准的一部分，现代浏览器都内置了`JSON.parse()`方法，这通常被认为更安全且推荐使用...

    jquery解析JSON数据的方法.docx

    jQuery提供了更安全的方式来解析JSON数据，即使用`.getJSON()`方法。`.getJSON()`是异步的，它会发送一个HTTP GET请求到指定的URL，然后将返回的JSON数据解析成JavaScript对象。例如： ```javascript $.getJSON(...

    Jquery解析json数据详解

    最近被jquery折磨了一番，倒腾了一个jquery解析json的demo,本demo想实现从asp.net后台实例化dataSet或者dataTable数据集，将dataSet转换成json并返回给客户端，客户端用jquery getJson方法解析出来并显示在页面上。...

    jQuery读取json数据

    关于"jQuery读取json数据"这个主题，我们将会深入探讨如何利用jQuery的Ajax功能来高效地加载和解析JSON格式的数据，以及这样做带来的优势。 JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，它易于...

    Jquery解析JSON和XML示例

    本文将详细讲解如何使用jQuery解析JSON和XML数据，通过给出的文件名称，我们可以推测这是一个关于Web应用中添加账户和应用的场景。 首先，让我们来看看JSON（JavaScript Object Notation）和XML（eXtensible Markup...

    JQuery操作json的例子

    这篇博客将探讨如何使用 jQuery 解析和操作 JSON 数据。 首先，我们需要了解 JSON 的基本结构。JSON 是基于 JavaScript 语法的，它由键值对（key-value pairs）组成，可以是对象或数组。例如： ```json { "name":...

    jquery_json.rar_JSON_jquery_jquery-json_jquery.json_jquery.json.

    收到JSON响应后，使用`$.parseJSON`将JSON字符串解析成JavaScript对象，然后可以方便地操作这些数据来更新DOM元素。反之，如果需要将用户在网页上的操作结果（如表单数据）发送回服务器，可以先使用`$.toJSON`将数据...

    jquery-json使用

    无论是解析JSON字符串，还是将JavaScript对象序列化为JSON，亦或是通过Ajax进行JSON数据的传输，jQuery都提供了直观且强大的工具。在实际开发中，熟练掌握这些技巧，能够提高工作效率，减少出错可能性，提升项目质量...

    jquery.json2xml.js和jquery.xml2json.js

    JSON（JavaScript Object Notation）和XML（eXtensible Markup Language）是两种广泛使用的数据交换格式，它们在Web服务和应用程序之间传输数据时起到至关重要的作用。jQuery是一个流行的JavaScript库，它简化了DOM...

    jquery.jsoncookie.zip

    2. 读取并解析JSON数据： ```javascript var jsonData = $.cookie('myJsonData'); var parsedData = JSON.parse(jsonData); ``` 这里，`$.cookie('myJsonData')`会获取Cookie的值，然后`JSON.parse()`用于将字符串...

    SSH+jQuery+json 实现的Ajax操作，绝对精华，代码简练清晰，绝对能看明白

    当用户选择省份后，jQuery会发送Ajax请求到服务器，服务器使用SSH框架处理请求，查询数据库并返回JSON格式的城市数据，最后jQuery解析JSON并在前端更新城市选择框。 总结来说，这个压缩包提供的示例是一个基于SSH...

    jquery-json美化

    1. **JSON解析**：在JavaScript中，可以使用`JSON.parse()`方法将JSON字符串转换为JavaScript对象，便于进一步处理。例如： ```javascript var jsonString = '{"name":"John", "age":30, "city":"New York"}'; ...

    使用JQuery实现从JSON对象转换为form提交数据

    首先，JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，它基于JavaScript的一个子集，易于人阅读和编写，同时也易于机器解析和生成。在前端应用中，我们经常从服务器获取JSON格式的数据，然后在...

Magicbox
Global site tag (gtag.js) - Google Analytics