`
jy00314996
  • 浏览: 75182 次
  • 性别: Icon_minigender_1
  • 来自: 济南
社区版块
存档分类
最新评论

用JQuery解析Json

jsonjQueryMobileServletJavaScript 
阅读更多

JSON的数据格式现在挺热门的！这里不解释了。主要讲下Jquery怎么解析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的动态效果效果演示
评论
发表评论

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

相关推荐

    用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