Question

我试图将json数据附加到表体。我可以把它附加到div但是当我试图将它附加到一个表时没有任何反应。几个小时我都在谷歌上搜索这个错误。我看到很多例子都采用相同的方法..

这是我的javascript代码：

   <script type="text/javascript">

    function getData2(id){
        $.ajax({
            type: "POST",
            url: "get.php",
            data: {id:id},
            dataType: "json",
            success:function(response)
            {
                var trHTML = '';
                $.each(response, function (i, item) {
                    trHTML +=   '<tr>' +
                                    '<td>' + item.data1 + '</td>' +
                                    '<td>' + item.data2 + '</td>' +
                                    '<td>' + item.data3 + '</td>' +
                                    '<td>' + item.data4 + '</td>' +
                                    '<td>' + item.data5 + '</td>' +
                                '</tr>';
                });

                //alert(trHTML); This Works.. I can see data in an alert
                //$('#aDiv').append(trHTML); This Works.. Appends to a div;

                //$('#tablebody').append(trHTML); Doesn't work..
                //$('#records_table tbody').append(trHTML); Doesn't work..
                $('#records_table').append(trHTML); Doesn't work..

            }
        });
    }

我的代码是：

<table id="records_table">
    <thead>
        <tr>
            <th>Head 1</th>
            <th>Head 1</th>
            <th>Head 1</th>
            <th>Head 1</th>
            <th>Head 1</th>
        </tr>   
    </thead>
    <tbody id="tablebody">
       //Json data will appear here...
    </tbody>
</table>

现在，我只想将我的json数据附加到表体中。但是我的代码的结果是

1 - 使用alert命令我可以看到所有数据 2 - 如果我将它附加到div，我可以看到所有数据 3 - 我无法将它附加到桌子或桌子上......

我无法理解我的错误在哪里......

提前感谢所有善良的人和他们的答案...

Answer 1

我在论坛上遇到了类似的问题，并检查了OP的代码，导致空<tr>。

$.each(response, function (i, item) {

       trHTML +=   '<tr><td>' + item.data1 + '</td><td>' + item.data2 + '</td><td>' + item.data3 + '</td><td>' + item.data4 + '</td><td>' + item.data5 + '</td></tr>';
                });

并保持其余代码相同。

Answer 2

这应该有效：

＆＃13;

var response = [{
    "data1": "1",
    "data2": "2",
    "data3": "3",
    "data4": "4",
    "data5": "5"
}];
var trHTML = '';
$.each(response, function (i, item) {
    trHTML += '<tr>' +
        '<td>' + item.data1 + '</td>' +
        '<td>' + item.data2 + '</td>' +
        '<td>' + item.data3 + '</td>' +
        '<td>' + item.data4 + '</td>' +
        '<td>' + item.data5 + '</td>' +
        '</tr>';
});

$('#records_table > tbody').append(trHTML);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="records_table">
    <thead>
        <tr>
            <th>Head 1</th>
            <th>Head 1</th>
            <th>Head 1</th>
            <th>Head 1</th>
            <th>Head 1</th>
        </tr>
    </thead>
    <tbody id="tablebody"></tbody>
</table>

＆＃13;

希望得到这个帮助。

Answer 3

＆＃13;

 $('#myTable > tbody:last').append(data);

＆＃13;

＆＃13; 这个脚本和我一起工作

Answer 4

试试这个： $（ '＃records_table'）的儿童（ 'TBODY'）附加（trHTML）;

将json数据附加到表体不起作用

4 个答案: