0

我看过很多关于排序的帖子，但没有一个回答似乎是典型的场景。

我正在尝试使用 jQuery 对 HTML 表进行排序，其中我单击以对列进行排序的链接在正在排序的表中不存在。我“伪造”了一个表格标题以适应滚动表格的要求。

我现在做的是——

  • 加载一个数组，其中包含需要与行 ID 一起选择的列中的值
  • 根据这些值对该数组进行排序
  • 根据该排序数组中的索引将行插入到 HTML 表中。

正如预期的那样，这需要将近 10 秒才能在本地运行。

代码示例 -

var sortArr = new Array();

$('tr td.' + name).each(function () {
    ResidentID = $(this).parent().attr("ResidentID");
    BID = $(this).parent().attr("BRecordID");

    if ($(this).find('select').length > 0) { //ddls
        columnText = $(this).find('select option:selected').text();
        sortArr.push({ residentId: ResidentID, bID: BID, text: columnText });
    }
    else if ($(this).find('input').length > 0) {//Textbox or checkboxes
        columnText = $(this).find('input').val();
        sortArr.push({ residentId: ResidentID, bID: BID, text: columnText });
    }
});

if (sortDirection == 'ascending') {
    colHeader.attr('sortorder', 'descending')
    sortArr = sortArr.sort(function (v, t) {
        return v.text.localeCompare(t.text);
    });
}
else {
    colHeader.attr('sortorder', 'ascending')
    sortArr = sortArr.sort(function (v, t) {
        return t.text.localeCompare(v.text);
    });
}

for (var i = 0; i < sortArr.length; i++) {
    $("[id$=fixedDataTable] > tbody > tr").eq(i).after($("[id$=trFixedDataRow_" + sortArr[i].residentId + "]"));

    $("[id$=residentDetailDataTable] > tbody > tr").eq(i).after($("[id$=trResScrollDataRow_" + sortArr[i].residentId + "]"));

    $("[id$=bDetailDataTable] > tbody > tr").eq(i).after($("[id$=trBScrollDataRow_" + sortArr[i].bmrID + "]"));
}

有没有更快的方法来实现这一点？

4

2 回答 2

0

您查找要排序的列、对其进行排序并重新填充表的方法是正确的。但是你这样做的方式看起来效率低下。您可以做几件事来加快速度

  1. 避免重构 jquery 对象。例如，您$(this)在许多地方都有。将其缓存在局部变量中。

  2. 而不是直接操作dom。考虑将数据放在二维数组中，该数组直接映射到 dom 表。我认为这将是最大的改进。您可以根据需要对二维数组进行排序，然后重新填充 dom 表。

  3. 考虑根据其单元格/行为每个表行提供唯一 ID。这样二维数组可以更容易地映射出来

    回到你的代码，这部分代码片段

    for (var i = 0; i < sortArr.length; i++) {
    $("[id$=fixedDataTable] > tbody > tr").eq(i).after($("[id$=trFixedDataRow_" +     sortArr[i].residentId + "]"));

    $("[id$=residentDetailDataTable] > tbody > tr").eq(i).after($("    [id$=trResScrollDataRow_" + sortArr[i].residentId + "]"));

    $("[id$=bDetailDataTable] > tbody > tr").eq(i).after($("[id$=trBScrollDataRow_" + sortArr[i].bmrID + "]"));
}

你可以在for循环之前将结果保存$("[id$=...tr")到一个变量中，这样jquery就不必在每次迭代中查找它吗？您或许可以自己索引缓存的数据？

于 2013-07-02T15:28:11.413 回答
0

坚持这种排序方式似乎是唯一的方法。

于 2013-07-02T20:27:09.270 回答