社区
学习
工具库
AI工具
休闲
搜索
简体中文
首页 web前端 js教程 jQuery解析json数据实例分析_jquery

jQuery解析json数据实例分析_jquery

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
May 16, 2016 pm 03:30 PM
jquery json

本文实例分析了jQuery解析json数据的方法。分享给大家供大家参考，具体如下：

先来看看我们的Json数据格式：

1

2

3

4

5

[

{id:01,name:"小白",old:29,sex:"男"},

{id:02,name:"小蓝",old:29,sex:"男"},

{id:03,name:"小雅",old:29,sex:"男"}

]

登录后复制

为了消除乱码问题，我们设置一个过滤器（代码片段）

1

2

3

4

5

6

public void doFilter(ServletRequest req, ServletResponse resp, FilterChain chain) throws ServletException, IOException {

    req.setCharacterEncoding("UTF-8");

    resp.setCharacterEncoding("UTF-8");

    resp.setContentType("text/html;charset=UTF-8");

    chain.doFilter(req, resp);

}

登录后复制

服务端我用Servlet生成json数据（代码片段）。

1

2

3

4

5

6

7

8

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

    PrintWriter out = response.getWriter(); //过滤器已经做过编码转化了。 resp.setContentType("text/html;charset=UTF-8");

    StringBuffer sb = new StringBuffer();

    sb.append("[{id:01,name:\"小白\",old:29,sex:\"男\"},");

    sb.append("{id:02,name:\"小蓝\",old:29,sex:\"男\"},");

    sb.append("{id:03,name:\"小雅\",old:29,sex:\"男\"}]");

    out.print(sb);

}

登录后复制

页面端JQuery代码：

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<html>

<head><title>json学习</title>

  <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">

  <script type="text/javascript" src="jslib/jquery.js" charset="UTF-8"></script>

  <script type="text/javascript" charset="UTF-8">

    $(document).ready(function() {

      var select = $("#select");

      $.get("json.do", null, function(data) {

        var jsonData = eval(data);//接收到的数据转化为JQuery对象，由JQuery为我们处理

        $.each(jsonData, function(index, objVal) { //遍历对象数组，index是数组的索引号，objVal是遍历的一个对象。

          //val["属性"]可取到对应的属性值。

          $("<option>").attr("value", objVal["id"]).html(objVal["name"]).appendTo(select);

        });

      });

    });

  </script>

</head>

<body>

<select id="select"></select>

</body>

</html>

登录后复制

之前为了省事，我层把json数据写到json.txt,json.jsp中，不用Servlet封装，可是后来我用Firebug调试了一下

写到.jsp、.txt文件中的json数据，没有被解析出来，Firebug中调试了一下，10行断点下一步直接结束，

就没有遍历对象数组。于是分别测试了一下

 文本文件  json.txt
 jsp文件   json.jsp
 Servlet   json.do

返回的数据，浏览器只有解析出Servlet的返回的数据是json数据

希望本文所述对大家jQuery程序设计有所帮助。

本站声明
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序，用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸！

显示更多

热门文章

刺客信条阴影：贝壳谜语解决方案
4 周前 By DDD
Windows 11 KB5054979中的新功能以及如何解决更新问题
3 周前 By DDD
在哪里可以找到原子中的起重机控制钥匙卡
4 周前 By DDD
<🎜>：死铁路 - 如何完成所有挑战
1 个月前 By DDD
如何修复KB5055523无法在Windows 11中安装？
2 周前 By DDD
显示更多

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版，非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

显示更多

热门话题

gmail邮箱登陆入口在哪里
7723
15
Java教程
1643
14
CakePHP 教程
1396
52
Laravel 教程
1290
25
PHP教程
1233
29
显示更多
Related knowledge
PHP 数组转 JSON 的性能优化技巧 PHP 数组转 JSON 的性能优化技巧 May 04, 2024 pm 06:15 PM

PHP数组转JSON的性能优化方法包括：使用JSON扩展和json_encode()函数；添加JSON_UNESCAPED_UNICODE选项以避免字符转义；使用缓冲区提高循环编码性能；缓存JSON编码结果；考虑使用第三方JSON编码库。

Jackson库中注解如何控制JSON序列化和反序列化？ Jackson库中注解如何控制JSON序列化和反序列化？ May 06, 2024 pm 10:09 PM

Jackson库中的注解可控制JSON序列化和反序列化：序列化：@JsonIgnore：忽略属性@JsonProperty：指定名称@JsonGetter：使用获取方法@JsonSetter：使用设置方法反序列化：@JsonIgnoreProperties：忽略属性@JsonProperty：指定名称@JsonCreator：使用构造函数@JsonDeserialize：自定义逻辑

深入了解PHP：JSON Unicode转中文的实现方法 深入了解PHP：JSON Unicode转中文的实现方法 Mar 05, 2024 pm 02:48 PM

深入了解PHP：JSONUnicode转中文的实现方法在开发中，我们经常会遇到需要处理JSON数据的情况，而JSON中的Unicode编码在一些场景下会给我们带来一些问题，特别是当需要将Unicode编码转换为中文字符时。在PHP中，有一些方法可以帮助我们实现这个转换过程，下面将介绍一种常用的方法，并提供具体的代码示例。首先，让我们先了解一下JSON中Un

PHP 数组转 JSON 的快捷技巧 PHP 数组转 JSON 的快捷技巧 May 03, 2024 pm 06:33 PM

PHP数组可通过json_encode()函数转换为JSON字符串（例如：$json=json_encode($array);），反之亦可用json_decode()函数从JSON转换为数组（$array=json_decode($json);）。其他技巧还包括：避免深度转换、指定自定义选项以及使用第三方库。

如何判断jQuery元素是否具有特定属性？ 如何判断jQuery元素是否具有特定属性？ Feb 29, 2024 am 09:03 AM

如何判断jQuery元素是否具有特定属性？在使用jQuery操作DOM元素时，经常会遇到需要判断元素是否具有某个特定属性的情况。这种情况下，我们可以借助jQuery提供的方法来轻松实现这一功能。下面将介绍两种常用的方法来判断一个jQuery元素是否具有特定属性，并附上具体的代码示例。方法一：使用attr()方法和typeof操作符//判断元素是否具有特定属

如何使用 PHP 函数处理 JSON 数据？ 如何使用 PHP 函数处理 JSON 数据？ May 04, 2024 pm 03:21 PM

PHP提供了以下函数来处理JSON数据：解析JSON数据：使用json_decode()将JSON字符串转换为PHP数组。创建JSON数据：使用json_encode()将PHP数组或对象转换为JSON字符串。获取JSON数据的特定值：使用PHP数组函数访问特定值，例如键值对或数组元素。

PHP教程：如何将JSON Unicode转换为中文字符 PHP教程：如何将JSON Unicode转换为中文字符 Mar 05, 2024 pm 06:36 PM

JSON（JavaScriptObjectNotation）是一种轻量级的数据交换格式，通常用于Web应用程序之间的数据交换。在处理JSON数据时，我们经常会遇到Unicode编码的中文字符（例如"u4e2du6587"），需要将其转换为可读的中文字符。在PHP中，我们可以通过一些简单的方法来实现这个转换。接下来，我们将详细介绍如何将JSONUnico

使用jQuery为表格添加新行的方法介绍 使用jQuery为表格添加新行的方法介绍 Feb 29, 2024 am 08:12 AM

jQuery是一个流行的JavaScript库，广泛用于网页开发中。在网页开发过程中，经常需要通过JavaScript动态地向表格中添加新行。本文将介绍如何使用jQuery为表格添加新行，并提供具体的代码示例。首先，我们需要在HTML页面中引入jQuery库。可以通过以下代码在标签中引入jQuery库：

See all articles