Javascript Jquery tablesorter不能与我的表一起使用（动态ajax）_Javascript_Jquery_Ajax_Html Table_Tablesorter

Javascript Jquery tablesorter不能与我的表一起使用（动态ajax）

javascript jquery ajax

Javascript Jquery tablesorter不能与我的表一起使用（动态ajax）,javascript,jquery,ajax,html-table,tablesorter,Javascript,Jquery,Ajax,Html Table,Tablesorter,Tablesorter无法使用我的表。我尝试使用.trigger（'update'），但它对我不起作用。Tru使用stupidtable，U工作但不正确（非排序字符串）函数表加载器（）{ $.ajax({ 网址：'http://127.0.0.1:8000/index_script' }).then（功能（数据）{ $（'apnd'）.empty（）；对于（变量i=0；i

Tablesorter无法使用我的表。我尝试使用

.trigger（'update'）

，但它对我不起作用。Tru使用stupidtable，U工作但不正确（非排序字符串）

函数表加载器（）{
$.ajax({
网址：'http://127.0.0.1:8000/index_script'
}).then（功能（数据）{
$（'apnd'）.empty（）；
对于（变量i=0；i

尝试以下更改：

将

$（“表格”）

替换为小写的

$（“表格”）

最后一个

+“”

无效，因为前一行以

结尾。。。这可能会导致JavaScript错误

不停地向表中追加行不是一种好的做法。最好构建整个行字符串，然后追加一次

在这种情况下，我认为将tablesorter初始化封装在一个document ready函数中不会有任何好处。它可以被移除

我假设

#apnd

是添加到

的id？如果没有

，则Tablesorter不会初始化

初始化tablesorter后无需立即触发更新。只有在初始化后内容发生更改时才需要

您不需要使用

$（'#apnd'）.empty（）

如果使用

.html（）

添加新行

这是更新后的代码。请尝试一下，并让我知道它是否有效：

function tableLoader() {
  $.ajax({
    url: 'http://127.0.0.1:8000/index_script'
  }).then(function (data) {
    var tbody = "";
    for (var i = 0; i < data.length; i++) {
      if ((data[i].autor) == (getname())) {
        tbody += "<tr>" +
          "<th><input value=" + data[i].trip_name + " id=trip_name" + data[i].id + "></th>" +
          "<th><input value=" + data[i].start_city + " id=start_city" + data[i].id + "\></th>" +
          "<th><input value=" + data[i].end_city + " id=end_city" + data[i].id + "\></th>" +
          "<th><input type=\"number\" value=" + data[i].days + " id=days" + data[i].id + "\></th>" +
          "<th><input type=\"number\" value=" + data[i].day_cost + " id=day_cost" + data[i].id + "\></th>" +
          "<th><input type=\"number\" value=" + data[i].hotel_per_day_cost + " id=hotel_per_day_cost" + data[i].id + "\></th>" +
          "<th><input type=\"number\" value=" + data[i].air_tickets_cost + " id=air_tickets_cost" + data[i].id + "\></th>" +
          "<th><input type=\"number\" value=" + data[i].other_transport_cost + " id=other_transport_cost" + data[i].id + "\></th>" +
          "<th><input type=\"number\" value=" + data[i].ticket_to_city_cost + " id=ticket_to_city_cost" + data[i].id + "\></th>" +
          "<th><input type=\"number\" value=" + data[i].ticket_from_city_cost + " id=ticket_from_city_cost" + data[i].id + "\></th>" +
          "<th>" + data[i].autor + "</th>" +
          "<th>" + "<button  type=\"button\"  id=\"Edit\" value=\"" + data[i].id + "\">Edit</button>\n" + "</th>" +
          "<th>" + "<button type=\"button\"  id=\"Delete\" value=\"" + data[i].id + "\">Delete</button>\n" + "</th>" +
        "</tr>";
      }
    }
    $('#apnd').html(tbody);
    $("table").tablesorter({
      theme: 'default',
      cssInfoBlock: "tablesorter-no-sort",
      widgets: ['zebra', 'stickyHeaders']
    })
  });
}

tableLoader();

函数表加载器（）{
$.ajax({
网址：'http://127.0.0.1:8000/index_script'
}).then（功能（数据）{
var tbody=“”；
对于（变量i=0；i