超过10行排序的HTML表无法工作

HTML table with more than 10 rows sorting is not working

本文关键字：工作 HTML 10行 排序 超过      更新时间：2023-09-26

我有一个问题，我的表不会排序(desc)，如果我在表中有超过10行。它工作完美，如果我有10或更少的行，而不是更多。下面是我的代码:

function sortAndFadingRows(rowId) {
    var $row = $(rowId);
    var oldRowIndex = $row.index();
    sortTable();
    var newRowIndex = $row.index();
    if (newRowIndex < oldRowIndex) {
        $row.children().effect('highlight', { color: '#fff' }, 1000);
    }                             }

var sortTable = function () {
    var table = $("#tableId");
    var sorts = table.find(".item").detach().toArray();
    sorts.sort(function (a, b) {
        var valA = parseInt($(a).find(".myValue").text());
        var valB = parseInt($(b).find(".myValue").text());
        return valA < valB; 
    });
   table.append(sorts);          };

我每次接收数据时都调用sortAndFadingRows(rowId)，当我接收到数据时，我直接将其放入特定列中的td中，以便根据该列对表进行排序。然后我发送行id来检查它的索引是否改变了。如果行跳转(其索引下降)，则突出显示，否则不突出显示。就像我说的，如果我们有10行或更少，但不超过10行，它就能完美地工作。有人知道我哪里做错了吗?

排序比较器函数应该返回一个数字，而不是一个布尔值。return语句应为

    return valA - valB;
比较器返回值被解释为:
  • 负数表示第一个项目应该排在第二个项目之前
  • 一个正数表示第二个项目应该在第一个项目之前
  • 0表示它们可以以任意顺序运行

JavaScript中.sort()例程的规范明确允许该算法不稳定。这意味着当比较器返回0时，项可能会被重新排序，而不是保持原来的顺序。

如果你需要稳定性，你可以在一些二级键上添加比较;也就是说，如果主键不同，则行中不重要的其他部分。要做到这一点，如果第一次比较结果为零，则必须提取副键:

  // ...
  var result = valA - valB;
  if (result !== 0)
    return result;
  // Fetch secondary keys
  valA = parseInt($(a).find(".secondary").text());
  valB = parseInt($(b).find(".secondary").text());
  return valA - valB;

如果没有二级键可以作为一种有意义的方式来保持顺序，您可以在排序之前对列表进行预处理，然后添加一个键，该键基于当前的顺序。

相关文章：