qq_32504001
2016-03-23 08:16
采纳率: 100%
浏览 3.5k

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

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,"YWName":"业务3","SName":"系统3","QDName":"渠道3","HJNumber":7}
]

jquery ajax读取json数据的方式

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

}

表格:


































table>

改如何实现呢

序号 业务名称 系统名称 渠道名称 环节数 操作
  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

3条回答 默认 最新

  • danielinbiti 2016-03-23 08: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 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>
    
    点赞 评论
  • qq_32504001 2016-03-23 08: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放入对象的表格位置。
    点赞 评论
  • qq_32504001 2016-03-23 08: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放入对象的表格位置。
    点赞 评论

相关推荐 更多相似问题