问题描述

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

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

jquery ajax读取json数据的方式

$.getJSON('test.txt'function(data){

}

表格：

table>
改如何实现呢

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

解决方案

 <script>$(document).ready(function(){   var data = [{""XH"":1YWName"":""业务1""SName"":""系统1""QDName"":""渠道1""HJNumber"":5}{""XH"":2YWName"":""业务2""SName"":""系统2""QDName"":""渠道2""HJNumber"":6}{""XH"":3YWName"":""业务3""SName"":""系统3""QDName"":""渠道3""HJNumber"":7}];  var $table=$('<table border=""1""></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>

解决方案二： var txt ='{""YWGL"":['+'{""XH"":1YWName"":""业务1""SName"":""系统1""QDName"":""渠道1""HJNumber"":5}'+'{""XH"":2YWName"":""业务2""SName"":""系统2""QDName"":""渠道2""HJNumber"":6}'+'{""XH"":3YWName"":""业务3""SName"":""系统3""QDName"":""渠道3""HJNumber"":7}]}';obj = JSON.parse(txt);//xh1、ywname1、sysname1、qdname1、hjs1//XH 、YWName、 SName 、QDName、HJNumberdocument.getElementById(""xh1"").innerHTML=obj.YWGL[0].XHdocument.getElementById(""ywname1"").innerHTML=obj.YWGL[0].YWNamedocument.getElementById(""sysname1"").innerHTML=obj.YWGL[0].SNamedocument.getElementById(""qdname1"").innerHTML=obj.YWGL[0].QDNamedocument.getElementById(""hjs1"").innerHTML=obj.YWGL[0].HJNumberdocument.getElementById(""xh2"").innerHTML=obj.YWGL[1].XHdocument.getElementById(""ywname2"").innerHTML=obj.YWGL[1].YWNamedocument.getElementById(""sysname2"").innerHTML=obj.YWGL[1].SNamedocument.getElementById(""qdname2"").innerHTML=obj.YWGL[1].QDNamedocument.getElementById(""hjs2"").innerHTML=obj.YWGL[1].HJNumberdocument.getElementById(""xh3"").innerHTML=obj.YWGL[2].XHdocument.getElementById(""ywname3"").innerHTML=obj.YWGL[2].YWNamedocument.getElementById(""sysname3"").innerHTML=obj.YWGL[2].SNamedocument.getElementById(""qdname3"").innerHTML=obj.YWGL[2].QDNamedocument.getElementById(""hjs3"").innerHTML=obj.YWGL[2].HJNumber
//这是我之前使用的js方法也可以把数据加入表格，不过现在需要使用jquery ajax所以放弃使用了

感谢楼上的回复，给我很多启发！！！

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

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

需求是：点击按钮后，导入json放入对象的表格位置。 解决方案三： var txt ='{""YWGL"":['+'{""XH"":1YWName"":""业务1""SName"":""系统1""QDName"":""渠道1""HJNumber"":5}'+'{""XH"":2YWName"":""业务2""SName"":""系统2""QDName"":""渠道2""HJNumber"":6}'+'{""XH"":3YWName"":""业务3""SName"":""系统3""QDName"":""渠道3""HJNumber"":7}]}';obj = JSON.parse(txt);//xh1、ywname1、sysname1、qdname1、hjs1//XH 、YWName、 SName 、QDName、HJNumberdocument.getElementById(""xh1"").innerHTML=obj.YWGL[0].XHdocument.getElementById(""ywname1"").innerHTML=obj.YWGL[0].YWNamedocument.getElementById(""sysname1"").innerHTML=obj.YWGL[0].SNamedocument.getElementById(""qdname1"").innerHTML=obj.YWGL[0].QDNamedocument.getElementById(""hjs1"").innerHTML=obj.YWGL[0].HJNumberdocument.getElementById(""xh2"").innerHTML=obj.YWGL[1].XHdocument.getElementById(""ywname2"").innerHTML=obj.YWGL[1].YWNamedocument.getElementById(""sysname2"").innerHTML=obj.YWGL[1].SNamedocument.getElementById(""qdname2"").innerHTML=obj.YWGL[1].QDNamedocument.getElementById(""hjs2"").innerHTML=obj.YWGL[1].HJNumberdocument.getElementById(""xh3"").innerHTML=obj.YWGL[2].XHdocument.getElementById(""ywname3"").innerHTML=obj.YWGL[2].YWNamedocument.getElementById(""sysname3"").innerHTML=obj.YWGL[2].SNamedocument.getElementById(""qdname3"").innerHTML=obj.YWGL[2].QDNamedocument.getElementById(""hjs3"").innerHTML=obj.YWGL[2].HJNumber
//这是我之前使用的js方法也可以把数据加入表格，不过现在需要使用jquery ajax所以放弃使用了

感谢楼上的回复，给我很多启发！！！

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

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

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