JSON

jquery ajax 读取json数据存入表格中

字号+ 作者:H5之家 来源:H5之家 2017-07-08 10:01 我要评论( )

test.txt的json数据如下 [ {XH:1,YWName:业务1,SName:系统1,QDName:渠道1,HJNumber:5}, {XH:2,YWName:业务2,SName:系统2,QDName:渠道2,HJNumber:6}, {XH:3,YWNam

danielinbiti      2016.03.23 16:26 已采纳

<script> $(document).ready(function(){ var data = [ {"XH":1,"YWName":"业务1","SName":"系统1","QDName":"渠道1","HJNumber":5}, {"XH":2,"YWName":"业务2","SName":"系统2","QDName":"渠道2","HJNumber":6}, {"XH":3,"YWName":"业务3","SName":"系统3","QDName":"渠道3","HJNumber":7} ]; var $table=$('<table></table>'); var $head =$('<tr><td>序号</td><td>业务名称</td><td>系统名称</td><td>渠道名称</td><td>环节数</td><td>操作</td></tr>'); $table.append($head); for(var i=0;i<data.length;i++){ var row = data[i]; var $tr = $('<tr></tr>'); var XH= $('<td>'+row['XH'] + '</td>'); var YWName= $('<td>'+row['YWName'] + '</td>'); var SName= $('<td>'+row['SName'] + '</td>'); var QDName= $('<td>'+row['QDName'] + '</td>'); var HJNumber= $('<td>'+row['HJNumber'] + '</td>'); $tr.append(XH).append(YWName).append(SName).append(QDName).append(HJNumber).append('<td></td>'); $table.append($tr); } $('body').append($table); }); </script>

没有帮助 赞同 评论 0

qq_32504001   2016.03.23 16:48

var txt ='{"YWGL":['+ '{"XH":1,"YWName":"业务1","SName":"系统1","QDName":"渠道1","HJNumber":5},'+ '{"XH":2,"YWName":"业务2","SName":"系统2","QDName":"渠道2","HJNumber":6},'+ '{"XH":3,"YWName":"业务3","SName":"系统3","QDName":"渠道3","HJNumber":7}]}'; obj = JSON.parse(txt); //xh1、ywname1、sysname1、qdname1、hjs1 //XH 、YWName、 SName 、QDName、HJNumber document.getElementById("xh1").innerHTML=obj.YWGL[0].XH document.getElementById("ywname1").innerHTML=obj.YWGL[0].YWName document.getElementById("sysname1").innerHTML=obj.YWGL[0].SName document.getElementById("qdname1").innerHTML=obj.YWGL[0].QDName document.getElementById("hjs1").innerHTML=obj.YWGL[0].HJNumber document.getElementById("xh2").innerHTML=obj.YWGL[1].XH document.getElementById("ywname2").innerHTML=obj.YWGL[1].YWName document.getElementById("sysname2").innerHTML=obj.YWGL[1].SName document.getElementById("qdname2").innerHTML=obj.YWGL[1].QDName document.getElementById("hjs2").innerHTML=obj.YWGL[1].HJNumber document.getElementById("xh3").innerHTML=obj.YWGL[2].XH document.getElementById("ywname3").innerHTML=obj.YWGL[2].YWName document.getElementById("sysname3").innerHTML=obj.YWGL[2].SName document.getElementById("qdname3").innerHTML=obj.YWGL[2].QDName document.getElementById("hjs3").innerHTML=obj.YWGL[2].HJNumber

//这是我之前使用的js方法也可以把数据加入表格,不过现在需要使用jquery ajax所以放弃使用了

感谢楼上的回复,给我很多启发!!!

json数据是在test.txt中的,我在load.html 中表格如图已经建好,现在实现一个查询功能,点击查询按钮,导入test.txt中

的json数据 我的表格是这样设置的



序号
业务名称
系统名称
渠道名称
环节数
操作



























需求是:点击按钮后,导入json放入对象的表格位置。

没有帮助 赞同 评论 0

qq_32504001   2016.03.23 16:49

var txt ='{"YWGL":['+ '{"XH":1,"YWName":"业务1","SName":"系统1","QDName":"渠道1","HJNumber":5},'+ '{"XH":2,"YWName":"业务2","SName":"系统2","QDName":"渠道2","HJNumber":6},'+ '{"XH":3,"YWName":"业务3","SName":"系统3","QDName":"渠道3","HJNumber":7}]}'; obj = JSON.parse(txt); //xh1、ywname1、sysname1、qdname1、hjs1 //XH 、YWName、 SName 、QDName、HJNumber document.getElementById("xh1").innerHTML=obj.YWGL[0].XH document.getElementById("ywname1").innerHTML=obj.YWGL[0].YWName document.getElementById("sysname1").innerHTML=obj.YWGL[0].SName document.getElementById("qdname1").innerHTML=obj.YWGL[0].QDName document.getElementById("hjs1").innerHTML=obj.YWGL[0].HJNumber document.getElementById("xh2").innerHTML=obj.YWGL[1].XH document.getElementById("ywname2").innerHTML=obj.YWGL[1].YWName document.getElementById("sysname2").innerHTML=obj.YWGL[1].SName document.getElementById("qdname2").innerHTML=obj.YWGL[1].QDName document.getElementById("hjs2").innerHTML=obj.YWGL[1].HJNumber document.getElementById("xh3").innerHTML=obj.YWGL[2].XH document.getElementById("ywname3").innerHTML=obj.YWGL[2].YWName document.getElementById("sysname3").innerHTML=obj.YWGL[2].SName document.getElementById("qdname3").innerHTML=obj.YWGL[2].QDName document.getElementById("hjs3").innerHTML=obj.YWGL[2].HJNumber

//这是我之前使用的js方法也可以把数据加入表格,不过现在需要使用jquery ajax所以放弃使用了

感谢楼上的回复,给我很多启发!!!

json数据是在test.txt中的,我在load.html 中表格如图已经建好,现在实现一个查询功能,点击查询按钮,导入test.txt中

的json数据 我的表格是这样设置的



序号
业务名称
系统名称
渠道名称
环节数
操作



























需求是:点击按钮后,导入json放入对象的表格位置。

没有帮助 赞同 评论 0

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • php json_encode与json_decode使用实例

    php json_encode与json_decode使用实例

    2017-07-05 10:03

  • Json精灵:JsonGenie软件官方下载

    Json精灵:JsonGenie软件官方下载

    2017-07-04 14:03

  • JSON字符串与JSON对象的区别

    JSON字符串与JSON对象的区别

    2017-07-02 09:01

  • 探讨PHP JSON中文乱码的解决方法详解

    探讨PHP JSON中文乱码的解决方法详解

    2017-07-01 14:02

网友点评