Question

我正在进行Chrome扩展。因此，此扩展将修改TAB表内容，然后需要求助。

在我做了一项研究之后，我发现jQuery tablesorter没有对由本地扩展脚本更新的 Modified 表进行排序。

我可以执行$（'table'）。触发器（'update'）然后使用tablesorter重建表 IF 我在TAB内容脚本中执行此操作。

但事实是，我的脚本处于隔离环境中，无法访问内容脚本变量或函数或对象。

如果我在扩展脚本中重建tablesorter，表格将响应TWICE，这很愚蠢。

我该怎么做才能解决这个问题。谢谢。梅森。

@Darin，我试过你的积分它不会起作用。

$("#xftw").after($("#pio").clone(0, 0));
$("#pio").eq(0).empty();


$("#pio").tablesorter({
    headers: {
        0: {
            sorter: false
        },
        2: {
            sorter: false
        },
        6: {
            sorter: "digit"
        },
        10: {
            sorter: false
        }
    },
    sortInitialOrder: "desc",
    sortList:[[7,1]],
    textExtraction: function (node) {
        if ($(node).attr("extraction") == "my") return "0" + $(node).find("span").text();
        var $firstNode = $(node).find(":first-child");
        return $firstNode.length <= 0 ? $(node).html() : $firstNode.html()
    },
    debug:true
});

var usersTable = $("#pio");
usersTable.trigger("update")
  .trigger("appendCache")
  .trigger("sorton", [[[6,1], [7,1]]]);

Answer 1

重建表格，隐藏原始表格，设置您控制的新表格。

或.preventDefault()

时使用.trigger

或者更改表格的id或classname，然后对其进行处理.trigger

基于旧表创建新表的一些粗略代码。

function copyTable(){
  var newTRs = [];
  var theTable = $(#tableID);
  var theRows = theTable.getElementsByTagName('tr');

  for (var i=0; i < theRows.length; i++){
    //you could also evaluate each row here and manipulate it as needed.
    newTRs.push(theRows[i].cloneNode(true));
  }
  return newTRs;
}

function buildNewTable(){
    var allRows = copyTable();
    var newTable = document.createElement('table');

    newTable.appendtherows(allRows);
    oldTable.attr('display','none');//or use a .class to hide old table
    $(newTable).appendTo(oldTablesDiv);
}

Chrome扩展jQuery tablesorter覆盖选项卡内容现有tablesorter JS

1 个答案: