jquery解析json格式数据的方法(对象、字符串)


Posted in Javascript onNovember 24, 2015

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

json数据是我们常用的一种小型的数据实时交换的一个东西,他可以利用jquery或js进行解析,下面我来介绍jquery解析json字符串方法。

一、jQuery解析Json数据格式:

使用这种方法,你必须在Ajax请求中设置参数:

dataType: "json"

获取通过回调函数返回的数据并解析得到我们想要的值,看源码:

jQuery.ajax({ 
url: full_url, 
dataType: "json", 
success: function(results) { 
alert(result.name); 
} });

通常情况下,你可以从后台返回JSON数据,前台就交给jQuery啦,哈哈!!

jquery异步请求将type(一般为这个配置属性)设为“json”,或者利用$.getJSON()方法获得服务器返回,那么就不需要eval()方法了,因为这时候得到的结果已经是json对象了,只需直接调用该对象即可,这里以$.getJSON方法为例

例1

代码如下:

var data=" 
{ 
root: 
[ 
{name:'1',value:'0'}, 
{name:'6101',value:'北京市'}, 
{name:'6102',value:'天津市'}, 
{name:'6103',value:'上海市'}, 
{name:'6104',value:'重庆市'}, 
{name:'6105',value:'渭南市'}, 
{name:'6106',value:'延安市'}, 
{name:'6107',value:'汉中市'}, 
{name:'6108',value:'榆林市'}, 
{name:'6109',value:'安康市'}, 
{name:'6110',value:'商洛市'} 
] 
}";

jquery

$.getJSON("https://3water.com/",{param:"sanic"},function(data){ 
//此处返回的data已经是json对象 
//以下其他操作同第一种情况 
$.each(data.root,function(idx,item){ 
if(idx==0){ 
return true;//同countinue,返回false同break 
} 
alert("name:"+item.name+",value:"+item.value); 
}); 
});

二、jQuery解析Json对象:

jQuery提供了另一种方法“parseJSON”,这需要一个标准的JSON字符串,并返回生成的JavaScript对象。让我们来看看语法:

data = $.parseJSON(string);

看看它是如何运用的到实际开发中的:
jQuery.ajax({ 
url: dataURL, success: function(results) { 
var parsedJson = jQuery.parseJSON(results); 
alert(parsedJson.name); 
} 
});

补充:

jquery解析json数据完整实例:

var data=" 
{ 
root: 
[ 
{name:'1',value:'0'}, 
{name:'6101',value:'北京市'}, 
{name:'6102',value:'天津市'}, 
{name:'6103',value:'上海市'}, 
{name:'6104',value:'重庆市'}, 
{name:'6105',value:'渭南市'}, 
{name:'6106',value:'延安市'}, 
{name:'6107',value:'汉中市'}, 
{name:'6108',value:'榆林市'}, 
{name:'6109',value:'安康市'}, 
{name:'6110',value:'商洛市'} 
] 
}"; 
//data为字符串类型 则要将字符串类型转换成json数据类型
var jsondatas=eval("("+data+")");
$.each(jsondatas.root,function(i,n){
alert("name"+n.name+"value"+n.value);
}
)
//以下为数组类型字符串 转换成json 字符串 解析
//数组形式的json字符串
 var jsondata="[{name:'1',value:'0'}, {name:'6101',value:'西安市'}, {name:'6102',value:'铜川市'}, {name:'6103',value:'宝鸡市'}, {name:'6104',value:'咸阳市'}, {name:'6105',value:'渭南市'}, {name:'6106',value:'延安市'}, {name:'6107',value:'汉中市'}, {name:'6108',value:'榆林市'}, {name:'6109',value:'安康市'}, {name:'6110',value:'商洛市'}]";
var json=eval(jsondata);
$.each(json,function(i,n){
alert(json[i].name);
alert(json[i].value);//根据索引取值
});
//json数据字符 不需要转换
var json={"Products":[ 
{"orderid":"11077","customerid":"RATTC"}, 
{"orderid":"11078","customerid":"RATT"} 
], 
"Img":[{"id":"12345","url" 
:"image/1.jpg"} 
]}; 
$.each(json.Products,function(i,n){
 alert(n.orderid);
})

一般处理文件(Handler.ashx)

if (context.Request.QueryString["method"] != null) 
  { 
   string method = context.Request.QueryString["method"].ToString(); 
   if (method == "getlist") 
   { 
    string str = ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString; 
    SqlConnection conn = new SqlConnection(str); 
    conn.Open(); 
    SqlCommand cmd = new SqlCommand(); 
    cmd.Connection = conn; 
    cmd.CommandText = "select ProID,ProName,url from Project where Adress = '哈尔滨'"; 
    DataSet ds = new DataSet(); 
    SqlDataAdapter da = new SqlDataAdapter(cmd); 
    da.Fill(ds); 
    string sb = CreateJsonParameters(ds.Tables[0]); 
    context.Response.ClearContent(); 
    context.Response.Write(sb.ToString()); 
    context.Response.End(); 
   } 
  } 
 } 
 /// <summary> 
 /// 构建JSON字符串 
 /// </summary> 
 /// <param name="dt"></param> 
 /// <returns></returns> 
 public string CreateJsonParameters(DataTable dt) 
 { 
  System.Text.StringBuilder sb = new System.Text.StringBuilder(); 
  if (dt != null && dt.Rows.Count > 0) 
   { 
   sb.Append("["); 
   for (int i = 0; i < dt.Rows.Count; i++) 
   { 
    sb.Append("{"); 
    for (int j = 0; j < dt.Columns.Count; j++) 
    { 
     //如果值不是最后一个则添加逗号分隔 
     if (j < dt.Columns.Count - 1) 
     { 
      sb.Append("/"" + dt.Columns[j].ColumnName.ToString() + "/":" + "/"" + dt.Rows[i][j].ToString() + "/","); 
     } 
     //如果值为最后个字符则不添加逗号 
     else if (j == dt.Columns.Count - 1) 
     { 
      sb.Append("/"" + dt.Columns[j].ColumnName.ToString() + "/":" + "/"" + dt.Rows[i][j].ToString() + "/""); 
     } 
    } 
    //如果为最后一个值的话 则不添加逗号 
    if (i == dt.Rows.Count - 1) 
    { 
     sb.Append("}"); 
    } 
    else 
    { 
     sb.Append("},"); 
    } 
   } 
   sb.Append("]"); 
   return sb.ToString(); 
  } 
  else { return null; } 
 }
$.ajax
  (
  {
   type: "POST",
   url: "Handler.ashx?method=getlist",
   async: false,//true表示异步 false表示同步
   contentType: "application/json",
   dataType: 'json',
   success: function(result) {
   var temp=eval(result);
   //通过javascript来解析返回数组字符串
   for (var i = 0; i < temp.length; i++) 
   { 
    o.innerHTML += "项目名称:" + result[i].ProName + "<br/>网址:<a href=" + result[i].url + " mce_href=" + result[i].url + " target='_blank'>" + result[i].url + "</a><br/>";
    datas += "项目名称:" + result[i].ProName + "<br/>网址:<a href=" + result[i].url + " mce_href=" + result[i].url + " target='_blank'>" + result[i].url + "</a><br/>";
   }
    TINY.box.show(datas, 0, 0, 0, 1);
   }
});

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

Javascript 相关文章推荐
JavaScript是否可实现多线程  深入理解JavaScript定时机制
Dec 22 Javascript
6款新颖的jQuery和CSS3进度条插件推荐
Mar 05 Javascript
javascript 获取模态窗口的滚动位置代码
Aug 06 Javascript
jqGrid日期格式的判断示例代码(开始日期与结束日期)
Nov 08 Javascript
Jquery 返回json数据在IE浏览器中提示下载的问题
May 18 Javascript
Javascript中的几种继承方式对比分析
Mar 22 Javascript
jquery处理checkbox(复选框)是否被选中实例代码
Jun 12 jQuery
JavaScript中重名的函数与对象示例详析
Sep 28 Javascript
vue移动端项目缓存问题实践记录
Oct 29 Javascript
vue组件之间通信实例总结(点赞功能)
Dec 05 Javascript
Node.js net模块功能及事件监听用法分析
Jan 05 Javascript
vue.js 打包时出现空白页和路径错误问题及解决方法
Jun 26 Javascript
Bootstrap每天必学之按钮(一)
Nov 24 #Javascript
JavaScript DOM 学习总结(五)
Nov 24 #Javascript
jQuery解析json数据实例分析
Nov 24 #Javascript
全面解析Bootstrap表单使用方法(表单按钮)
Nov 24 #Javascript
全面解析Bootstrap表单使用方法(表单控件状态)
Nov 24 #Javascript
jQuery解析Json实例详解
Nov 24 #Javascript
全面解析Bootstrap表单使用方法(表单控件)
Nov 24 #Javascript
You might like
PHP一些有意思的小区别
2006/12/06 PHP
PHP基于堆栈实现的高级计算器功能示例
2017/09/15 PHP
PHP中非常有用却鲜有人知的函数集锦
2019/08/17 PHP
PHP实现基本留言板功能原理与步骤详解
2020/03/26 PHP
PHP常用header头定义代码示例汇总
2020/08/29 PHP
js技巧--转义符&quot;\&quot;的妙用
2007/01/09 Javascript
一个用javascript写的select支持上下键、首字母筛选以及回车取值的功能
2009/09/09 Javascript
Jquery 1.42 checkbox 全选和反选代码
2010/03/27 Javascript
jquery图片上下tab切换效果
2011/03/18 Javascript
javascript中获取下个月一号,是星期几
2012/06/01 Javascript
js监听滚动条滚动事件使得某个标签内容始终位于同一位置
2014/01/24 Javascript
JavaScript函数的调用以及参数传递
2015/10/21 Javascript
深入探究AngularJS框架中Scope对象的超级教程
2016/01/04 Javascript
WebGL利用FBO完成立方体贴图效果完整实例(附demo源码下载)
2016/01/26 Javascript
VUEJS实战之利用laypage插件实现分页(3)
2016/06/13 Javascript
微信小程序前端源码逻辑和工作流
2016/09/25 Javascript
纯JS实现弹性导航条效果
2017/03/06 Javascript
canvas实现刮刮卡效果
2017/03/14 Javascript
vue在使用ECharts时的异步更新和数据加载详解
2017/11/22 Javascript
JavaScript解析及序列化JSON的方法实例分析
2019/01/04 Javascript
微信小程序分包加载代码实现方法详解
2019/09/23 Javascript
javascript实现蒙版与禁止页面滚动
2020/01/11 Javascript
微信小程序实现发微博功能的示例代码
2020/06/24 Javascript
[01:14]3.19DOTA2发布会 三代刀塔人第二代
2014/03/25 DOTA
[52:37]完美世界DOTA2联赛循环赛 Forest vs DM BO2第一场 10.29
2020/10/29 DOTA
Python编写登陆接口的方法
2017/07/10 Python
对python抓取需要登录网站数据的方法详解
2018/05/21 Python
Python和Java的语法对比分析语法简洁上python的确完美胜出
2019/05/10 Python
关于numpy数组轴的使用详解
2019/12/05 Python
Python下载网易云歌单歌曲的示例代码
2020/08/12 Python
HTML5拖拽的简单实例
2016/05/30 HTML / CSS
h5页面唤起app如果没安装就跳转下载(iOS和Android)
2020/06/03 HTML / CSS
工商管理实习自我鉴定
2013/09/28 职场文书
公司投资建议书
2014/05/16 职场文书
终止劳动合同协议书
2014/10/05 职场文书
关于 Python json中load和loads区别
2021/11/07 Python