如何使用这些 JSON 结果在 jQuery 中构建动态 html 表？

Question

我有一个文本字段，用户在其中输入一些数字并单击“搜索”按钮。单击“搜索”按钮时，它会显示与该编号相关的所有 JSON 记录。如何通过循环遍历每条记录来构造动态 HTML 表？这是我从 PHP 返回的 JSON 结构：

[{"number":"ABC123-product1","value":"HN895","status":true},
{"number":"AYD223-product2","value":"JU226","status":true},
{"number":"AXU323-product3","value":"OL223","status":true}]  

$('#button').click(function(e){
    if($("#txt1field")!=''){
      $.getJSON("student.php",{'no' : $("#txt1field").attr('value'),'search' :''},
        function(data){
           $.ajaxSetup ({ cache: false}); 
           var i=0;
           $.each(data, function(number,value) {
        alert(" Number=="+data[i].number+"value==="+data[i].value);
        i++;
           //How do i construct HTML TABLE and put this items  in to a table with each row having the 
          radiobutton , number,value
       });
     });
   }
  }); 

如何构建一个 HTML 表格并将这些项目放入其中，每行都有一个单选按钮、数字和值？请帮助我

Answer 1

$('#button').click(function(e){
    if($("#txt1field")!=''){
      $.getJSON("student.php",{'no' : $("#txt1field").attr('value'),'search' :''},
        function(data){
           $.ajaxSetup ({ cache: false});
           var t;
           $.each(data, function(number,item) {
              t += '<tr><td><input type="radio" ... /></td><td>'+item.number+'</td><td>'+item.value+'</td></tr>';
           });


           //insert a new table
           t = '<table ...>'+t+'</table>';
           $('div#output').html(t); 


           //or "append" if you wish to insert the rows in an existing table
           $('table#output').append(t)
        });
   }
});

祝你好运！