先给大家说下我的需求:进行ajax请求后,后台传递回来以下json数据。
具体实现代码如下所示:
javascript代码
{ data:[ {id:1,name:选择a,value:a}, {id:2,name:选择b,value:b}, {id:3,name:选择c,value:c} ] }
对上面的json数据类在jquery 的success 函数中解析
javascript代码
$.ajax({ type: post, url: xxx.do, datatype : json, // 指定返回类型 data: {xxx:yyy}, // 传递到后台的参数 success: function(data) { $.each(data, function(index,values){ // 解析出data对应的object数组 $.each(values,function(index2,value){ // 遍历object数组 ,每个对象的值存放在value ,index2表示为第几个对象 // 根据自己的逻辑进行数据的处理 alert(value.name + + value.value); // todo: 逻辑 }); }); }, error : function() { alert(系统出现问题); } });
继续来个例子
本章节分享一段代码实例,是jquery封装的ajax对json数据的请求处理。
代码比较简单,对于有经验的人员来说可以掠过,初学者可以做一下参考之用。
代码如下:
<!doctype html> <html> <head> <meta charset=" utf-8"> <title>脚本之家</title> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script> <script> $(document).ready(function(){ $(#bt).click(function(){ $.ajax({ type: get, datatype: json, url: demo/jquery/ajax/txt/json.txt, success: function(msg){ var data = msg str=; $.each(data,function(index, n){ str=str+data[index].webname+,+data[index].url+,+data[index].age+<br/>; }); $(#show).html(str); } }); }) }) </script> </head> <body> <p id="show"></p> <input type="button" id="bt" value="查看效果"/> </body> </html>
相信看了本文案例你已经掌握了方法,更多精彩请关注其它相关文章!
推荐阅读:
ajaxtoolkit怎么使用rating控件
ajax实现文件上传带进度条效果功能
以上就是jquery+ajax怎么实现json数据的遍历的详细内容。