Question

我已经编写了以下功能，但我确定存在错误。当我尝试执行这个代码块时，这是错误

TypeError: 'undefined' is not a function (evaluating 'callback.apply( obj[ i ], args )')

Jquery函数接收数据json list correctlu

$("#result_times")
    .find("tr")
    .remove()
    .end();

$("#result_times")
    .find("table")
    .each(data, function(){  
        $(this).append($("<tr>"));
        $(this).append($("<td></td>")).text(data.airport_city_source);
        $(this).append($("<td></td>")).text(data.airport_city_dest);
        $(this).append($("<td></td>")).text((data.departure_date));
        $(this).append($("<td></td>")).text((data.arrival_date));
        $(this).append($("</tr>"));
    });

这是DOM

<div id='result_times'>

            <table>


            </table>


        </div>

你能告诉我哪里错了吗？

Answer 1

如果您正在处理元素

，

.append()不会像连接一样工作

尝试，

var table = $("#result_times").find("table");
$.each(data, function(k, val){  
   table.append(
     $("<tr><td>"+ data.airport_city_source +"</td>"
         + "<td>"+ data.airport_city_dest +"</td>"
         + "<td>"+ data.departure_date +"</td>"
         + "<td>"+ data.arrival_date +"</td>"
      +"</tr>")
   );
});

最初以错误的方式回答。将其更新为正确的。

Answer 2

当您使用.each()功能时，您正在使用$.each()方法。您还没有附加到正确的元素 - 您尝试将<td>元素附加到表格中，它们必须附加到行中，并且文本必须应用于<td>元素，而不是<td>附加到的元素。基本上，您编写代码就好像.append()只是连接HTML文本，而不是将元素插入DOM。

var table = $("#result_times table");
$.each(data, function() {
    var row = $("<tr>").appendTo(table);
    row.append($("<td>", {text: data.airport_city_source}));
    row.append($("<td>", {text: data.airport_city_dest});
    row.append($("<td>", {text: data.departure_date}));
    row.append($("<td>", {text: data.arrival_date}));
});

Answer 3

你在每个表上运行each()，所以jQuery期望一个函数作为每个表的第一个参数，而不是data。你也在错误的元素上调用text()。

使用data运行$.each上的每一个。

工作示例：

<强> Demo

$("#result_times")
    .find("tr")
    .remove()
    .end();

var table = $('#result_times table');

$.each(data, function(){
    table.append(
        $('<tr></tr>').append(
            $('<td></td>').text(this.airport_city_source),
            $('<td></td>').text(this.airport_city_dest),
            $('<td></td>').text(this.departure_date),
            $('<td></td>').text(this.arrival_date)
        )
    );
});

Answer 4

尝试这样的事情

var tbl_row = '';
$.each(data, function(){
    tbl_row += '<tr>';
        tbl_row += '"<td>'+data.airport_city_source+'</td>';
        tbl_row += '"<td>'+data.airport_city_dest+'</td>';
        tbl_row += '"<td>'+data.departure_date+'</td>';
        tbl_row += '"<td>'+data.arrival_date+'</td>';
    tbl_row += '</tr>';
});
// append only one time, will have effect performance if table is bigger.
$("#result_times").find("table").append($(tbl_row));

在表格中打印json数据

4 个答案: