Ajax中JSON数据的创建与获取【JQuery】

原创 2012年03月26日 00:35:39
一直以来用ajax都是简单的传递字符串。目前项目中需要进行相对复杂的ajax传值,所以研究了一下json,居然以前没有接触过,囧啊。。。

JSON = Javascript Object Notation
它是javascript专有的一种数据格式,类似于xml,但是比xml还要简单易用。同时它也是轻量级的javascript库。

JSON 文件

  • JSON 文件的文件类型是 ".json"
  • JSON 文本的 MIME 类型是 "application/json"


定义它的基本格式是:

var people = {"programmers": [     {"firstName":"Brett","lastName":"McLaughlin","email":"brett@newInstance.com"},     
                                   {"firstName":"Jason","lastName":"Hunter","email":"jason@servlets.com"},     
                                   {"firstName":"Elliotte","lastName":"Harold","email":"elharo@macfaq.com"}   
                             ],   
              "authors": [     {"firstName":"Isaac","lastName":"Asimov","genre":"science fiction"},     
                               {"firstName":"Tad","lastName":"Williams","genre":"fantasy"},     
                               {"firstName":"Frank","lastName":"Peretti","genre":"christian fiction"}   
                         ],   
              "musicians": [     {"firstName":"Eric","lastName":"Clapton","instrument":"guitar"},     
                                 {"firstName":"Sergei","lastName":"Rachmaninoff","instrument":"piano"}   
                           ]   
    }


JSON 值可以是:

  • 数字(整数或浮点数)
  • 字符串(在双引号中)
  • 逻辑值(true 或 false)
  • 数组(在方括号中)
  • 对象(在花括号中)
  • null


调用方法:
name = people.programmers[0].firstName;

解析JSON文件:
obj = JSON.parse(txt);
name = obj.people.programmers[0].firstName;

AJAX中POST提交参数并获得JSON数据:

    $.post("myajax.do",{
                                 "name":$("#name").val()
                                        },
                        function(text){
                                            $("#name1").text(text.people[0].name);
                                            $("#tel").text(text.people[0].tel);
                                       },
              "json");



ACTION里手动转换JSON数据:

//获得表单传入参数
String name = myajaxForm.getName();
String tel = myajaxForm.getTel();
//实例化输出
Writer out = response.getWriter();
//引号未转义
String json = "{"people":
                         [
                              {
                              "name":name,
                              "tel":tel
                              }
                         ]
               }";
//输出
out.write(json);



【记得按钮onclick事件后一定要return false】

JQuery创建JSON对象

通过 JSON 字符串来创建对象 First Name: Last Name: //txt为字符串 var txt = '{"employees":[' + '{"firstName"...
  • u013474436
  • u013474436
  • 2015年06月02日 23:26
  • 5955

利用Jquery+JS生成Json串,动态创建添加项

需求:在一张页面中创建若干个子问题。创建数量不确定,子问题没有主键ID可查。页面内容和子问题内容存在主外键关系。点击“保存”时,将主表内容和子问题内容一同保存进数据库。页面如下图: 主表和子表数据...
  • hlbt0112
  • hlbt0112
  • 2016年01月15日 16:18
  • 4805

web中用ajax传递json数据到后台

个人笔记,不喜欢勿评论 今天学习了一下如何使用ajax传递json数据到后台 1、首先需要导入几个json的jar包; 2、开始写代码      前端代码: ...
  • u013086006
  • u013086006
  • 2016年05月19日 15:09
  • 10870

通过AJAX与Servlet进行交互:通过JSON传递数据

使用AJAX与Servlet进行交互
  • zzl1243976730
  • zzl1243976730
  • 2016年09月18日 22:27
  • 9279

JSON进阶第二篇 AJAX方式传递JSON数据

上一篇《JSON进阶第一篇 在PHP与javascript 中使用JSON》示范了在PHP和javascript中如何使用JSON类型的数据,本篇将介绍用AJAX方式得到JSON数据从而动态生成标题和...
  • MoreWindows
  • MoreWindows
  • 2012年01月17日 10:14
  • 17203

$.ajax传递json对象到后台

var mall = {             MallID: $("#createId").val().trim(),             MallName: $("#...
  • qq_31749287
  • qq_31749287
  • 2017年03月10日 23:33
  • 3621

Ajax传递Json数据

首先我们要用到程序集Newtonsoft.Json.dll 和 JS插件 jquery.json-2.3.js   我已经在资源库 提供了下载  没有的朋友可以去下载 前台aspx代码 ...
  • ScorpionFZ
  • ScorpionFZ
  • 2011年10月19日 19:44
  • 8154

javascript、JQuery操作数组、Json对象、缓存

1.创建JSON对象 var objJson = [];   2.赋值 var objJson = jQuery.parseJSON('[{"PID":1,"Cnt":1}]'); objJso...
  • lonestar555
  • lonestar555
  • 2013年09月07日 17:08
  • 27088

$.ajax()方法从服务器获取json数据几种方式详解

对$.ajax()方法从服务器获取json数据的几种方式进行详解
  • Sun9528
  • Sun9528
  • 2017年06月10日 10:45
  • 9403

Jquery 使用Ajax获取后台返回的Json数据后,页面处理

$(function () { $.ajax({ url: 'jsondata.ashx', type: 'GET', ...
  • smartsmile2012
  • smartsmile2012
  • 2013年12月09日 11:38
  • 239825
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Ajax中JSON数据的创建与获取【JQuery】
举报原因:
原因补充:

(最多只允许输入30个字)