Question

我的jquery代码还有另外一个问题。这里有一些示例代码：

$(document).on('click', 'input.goto_batterie_pruefung', function() {
   /** some code**/
    $.ajax({
        url: "example.php",
        type: "post",
        data: /* some data */,
        datatype: "json",
        success: function(data) {

            var data=$.parseJSON(data);

            $('#div_testausgabe').html('');
            $('#div_testausgabe').append('<hr /><table><thead><tr><th></th><th></th><th></th><th></th><th></th><th></th><th></th></tr></thead><tbody>');

            $.each(data, function(index, value) {
                  /* some variables for tabledata */

                $('#div_testausgabe').append('<tr>');
                var text='<td>'+data+'</td><td>'+data+'</td><td>'+data+'</td><td>'+data+'</td><td>'+data+'</td><td>'+data+'</td><td>'+data+'</td>';
                $('#div_testausgabe').append(text);
                $('#div_testausgabe').append('</tr>');
            });

            $('#div_testausgabe').append('</tbody></table><hr />');

        }
    });
});

我的问题是表格没有正确创建。表格标签仅包围thead部分。

Answer 1

你肯定错误地建造了这个桌子。 .append()将附加到<div id="div_testausgabe">，因此您最终会

<div> id="div_testausgabe">
   <hr /><table><thead> blah blah blah from your first .append call</table>
   <tr><td>row #1 from the .each() call></tr></td>
   <tr><td>row #2 from the .each() call()</tr></td>
   etc...
</div>

您需要隔离div中的实际表格，例如

$('#div_testausgabe table tbody').append(....);
                    ^^^^^^^^^^^

以便您的新tr / td节点进入正确的位置。

Answer 2

不要附加部分html，你会多次更新DOM，使其变慢并导致多次重绘，浏览器会尝试纠正它。

你应该构建一个html字符串，然后在$.each()循环之后追加它。

类似的东西：

$('#div_testausgabe').html('');
var table_html = '<hr /><table><thead><tr><th></th><th></th><th></th><th></th><th></th><th></th><th></th></tr></thead><tbody>';

$.each(data, function(index, value) {
    table_html += '<tr><td>'+data+'</td><td>'+data+'</td><td>'+data+'</td><td>'+data+'</td><td>'+data+'</td><td>'+data+'</td><td>'+data+'</td></tr>';
});

table_html += '</tbody></table><hr />';
$('#div_testausgabe').append(table_html);

Answer 3

你正在使用jQuery的append（），好像它是一个字符串连接，它不是。

用jquery创建表。错误的代码执行顺序？

3 个答案: