1

我已经通过 Web 服务调用访问了 JSON 数据并解析了 JSON 数据。我想知道如何在 HTML 表格中打印 JSON 数据???

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>File Download</title>
<script type="text/javascript" src="Scripts/jquery-1.7.2.min.js"></script>
<script type="text/javascript">

    function jsonparser1() {
        $.ajax({
            type: "GET",
            crossDomain: true,
            url: "http://10.211.2.219:8080/JerseyWebService/rest/sample/files",
            dataType: "jsonp",
            success: function (res) {
                $.each(res['data'], function (i, row) {
                    var ftime = row['time'];
                    var fname = row['name'];
                    var fhref = row['href'];

                    document.myform.???????????????=ftime;
                    ??????????????????????????????????????
                    ??????????????????????????????????????  
                })
            },

            error: function (xml) {
                alert(xml.status + ' ' + xml.statusText);
            }
        });
    }        
</script>    
</head>
<body>
<form name="myform">
    <input type="button" name="clickme" value="Click here to display the details of the files" onclick=jsonparser1() />
    ??????????????????????????????????????????
    ??????????????????????????????????????????     
</form>
</body>
</html>

我使用的 JSON 数据是:

{"data":[{"id":13,"time":"02-08-2012 3:24:45 PM","name":"jersey-multipart-1.0.3.144640.jar","href":"file://chndlf716168/TempUp/1343901285087-FileName-jersey-multipart-1.0.3.144640.jar"},{"id":14,"time":"02-08-2012 3:36:0 PM","name":"icloud_hero.png.png","href":"file://chndlf716168/TempUp/1343901960304-FileName-icloud_hero.png.png"}],"code":true}

我想以表格格式显示时间、名称和 href 属性。href 应该在锚标记中。如果将更多数据附加到 JSON 文件中,则表应该可以灵活更改。第一步是我必须以表格格式显示详细信息。

任何人都请在这件事上提供帮助...在此先感谢...

4

3 回答 3

1

希望这可以帮助:

$("document").ready(function() {
    $.getJSON("http://localhost:1909/encoders", function(data) {

        $("#div-my-table").text("<table>");

        $.each(data, function(i, item) {
            $("#div-my-table").append("<tr><td>" + item.EncoderName +"</td><td>" + item.EncoderStatus + "</td></tr>");
        });

        $("#div-my-table").append("</table>");

    });
});
于 2012-08-02T10:41:56.550 回答
0

试试这个

var output = "<table>";
    $.each(res['data'], function (i, row) {                     
        var ftime = row['time'];                     
        var fname = row['name'];                     
        var fhref = row['href'];
        output+="<tr><td>VARIABLE VALUE</td></tr>";
        })
output += "</table>";

当 outpur 变量准备好内容时。将其打印在所需位置。

于 2012-08-02T10:42:30.830 回答
0

这是每个循环中的基本 jquery 执行此操作。

$row = $('<tr></tr>');
$row.append('<td>' + somedata + '</td>');
// repeat the above line for each data item
$('#mytable).append($row);

在您的 HTML 中创建<table id="mytable"></table>

于 2012-08-02T10:44:20.543 回答