• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >jquery > jQuery解析json数据实例分析

jQuery解析json数据实例分析

作者:xiaofancn 字体:[增加 减小] 来源:互联网

xiaofancn 通过本文主要向大家介绍了jQuery,json,jQuery解析json等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

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

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

[
{id:01,name:"小白",old:29,sex:"男"},
{id:02,name:"小蓝",old:29,sex:"男"},
{id:03,name:"小雅",old:29,sex:"男"}
]

为了消除乱码问题,我们设置一个过滤器(代码片段)

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数据(代码片段)。

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代码:

<%@ 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程序设计有所帮助。

分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • 基于jQuery对象和DOM对象和字符串之间的转化实例
  • jquery+css实现简单的图片轮播效果
  • 使用jQuery实现鼠标点击左右按钮滑动切换
  • jQuery实现上传图片前预览效果功能
  • jQuery初级教程之网站品牌列表效果
  • 基于jquery实现多选下拉列表
  • jQuery接受后台传递的List的实例详解
  • 详解jquery选择器的原理
  • jQuery上传插件webupload使用方法
  • 关于jquery form表单序列化的注意事项详解

相关文章

  • jQuery获取file控件中图片的宽高与大小
  • jQuery Lightbox 图片展示插件使用说明
  • jQuery学习笔记之DOM对象和jQuery对象
  • 基于jQuery Bar Indicator 插件实现进度条展示效果
  • Jquery 类网页微信二维码图块滚动效果具体实现
  • jQuery第三课 修改元素属性及内容的代码
  • jquery的ajax异步请求接收返回json数据实例
  • jquery密码强度校验
  • 分享一个asp.net pager分页控件
  • js/jquery获取浏览器窗口可视区域高度和宽度以及滚动条高度实现代码

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • jQuery四种选择器使用及示例
    • 24款热门实用的jQuery插件推荐
    • jquery判断input值不为空的方法
    • jquery 中ajax执行的优先级
    • JQuery设置文本框和密码框得到焦点时的样式
    • jQuery validate 中文API 附validate.js中文api手册
    • jQuery 计算iframe 窗口大小的方法
    • jQuery中clearQueue()方法用法实例
    • JQuery 操作/获取table具体代码
    • jQuery实现手机上输入后隐藏键盘功能

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有