Question

我有一个安装了tablesorter的基本表，使用链接对隐藏列进行排序，而不是在显示的列上使用标题。这在Firefox，Safari，Chrome和Opera（我可以访问的所有版本）中都能很好地工作，但在IE 7和8中，只能对表中的最后一列进行排序。其他人在jquery.tablesorter.js上收到“Line：552错误：'undefined'为空或不是对象”（关闭缩小版本以尝试调试它）。遗憾的是，我必须继续支持IE，因为我的页面访问者中有42％使用IE 8或更低版本。（不要关心IE 6或更低版本。）

研究已经发现对象中缺少/额外逗号的可能性是常见原因，但我在代码中没有发现任何额外或缺失。最后一列适用于排序，但不能隐藏任何其他列。我确实确认改变列的顺序只能证明它是最后一列有效，而前三列没有。 - 更新进一步的研究证明，在该列上显示列的排序很好，因此它似乎必须专门处理被隐藏的列。

下面是我的排序功能（删除了一些无关的位）。如果您对完整的代码和表格感到好奇，here's the live site

function setUpSorting() {
    var $search_results = $j('#search_results');
    $search_results.tablesorter({
        headers: {
            0: {sorter: false},
            1: {sorter: false},
            2: {sorter: false}  // sorting done on 3, 4, 5, and 6
        }
    });

    var $sort_options = $j('#sort_options > a');

    $sort_options.click(function (e) {
        e.preventDefault();
        var $this = $j(this);
        var order;

        if ($this.hasClass('selected_sort')) {
            if ($this.hasClass('descending')) {
                $this.removeClass('descending');
                order = 0;
            } else {
                $this.addClass('descending');
                order = 1;
            }
        } else {
            $sort_options.removeClass('selected_sort descending');
            $this.addClass('selected_sort');
            order = 0;
        }

        var sorting;

        if (this.id == 'sort_job') {
            sorting = [[3, order]];
        } else if (this.id == 'sort_dept') {
            sorting = [[4, order]];
        } else if (this.id == 'sort_salary') {
            sorting = [[5, order]];
        } else if (this.id == 'sort_date') {
            // switch the order for this one
            if (order == 1) {
                sorting = [[6, 0]];
            } else {
                sorting = [[6, 1]];
            }
        }

        $search_results.trigger('sorton', [sorting]);
    });

    // initial sort
    $j('#sort_date').click();
}

这是表格的基本布局：

<table>
  <thead class="hidden">
    <tr><th id="job_dept_titles" scope="col">Job/Dept Title</th></tr>
    <tr><th id="salary_hours" scope="col">Salary/HPW</th></tr>
    <tr><th id="start_app" scope="col">start application</th></tr>
    <tr><th id="sorting_job_title" class="hidden" scope="col">Job Title</th></tr>
    <tr><th id="sorting_dept" class="hidden" scope="col">Dept Title</th></tr>
    <tr><th id="sorting_salary" class="hidden {sorter: 'digit'}" scope="col">salary</th></tr>
    <tr><th id="sorting_date" class="hidden" scope="col">date posted</th></tr>
  </thead>
  <tfoot><tr></tr></tfoot>
  <tbody>
    <tr>
      <td headers="job_dept_titles">
        Super cool job <span class="new_line">Super cool department</span>
      </td>
      <td headers="salary_hours">$3242<span class="new_line">Full Time</span></td>
      <td headers="start_app"><a..>Start my app</a></td>
      <td headers="sorting_job_title" class="hidden">Super cool job</td>
      <td headers="sorting_dept" class="hidden">Super cool department</td>
      <td headers="sorting_salary" class="hidden">3242</td>
      <td headers="sorting_date" class="hidden">20110901</td>
    </tr>
  </tbody>
</table>

我有一种感觉，这是一种愚蠢的东西，我很想念，因为我一直试图将这个问题弄清楚几周。任何帮助将不胜感激。

Answer 1

IE因错误计算cellIndex，修补bug，然后忘记下一个版本中的错误并再次修补它而臭名昭着。您需要使用函数修补tablesorter以确定单元格索引。将此函数插入到tablesorter设置标头索引的位置，并将所有引用从cell.cellIndex更改为 getCellIndex（cell）;

function getCellIndex(aCell) {
    aRow = aCell.parentNode;
    for (i = 0; i != aRow.cells.length; i++) {
        if (aRow.cells[i] == aCell) return i;
    }
    return false;
}

仅限IE浏览器中的jquery Tablesorter问题 - 用于排序的链接仅适用于最后隐藏的列而不是其他列

1 个答案: