Question

在w3上找到了这个简单的解决方案

https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_sort_table_desc

它工作得很好但是即使你在表格中添加数字，也要按A到Z对表格进行排序。因此，如果您有以下值：1,2,3,1 ...它会将它分类为1,11,2,3。我实际上希望这是一个重复的问题，但我无法在这里找到答案。如何获取排序功能以排序无数值？ ...也许你也知道要按日期排序？

Answer 1

我已经参与了您共享的示例中asc或dsc比较的部分。

如果查看示例sortTable()中的<script>函数 - 您将值比较为字符串，因此数字的排序方式如-1,11,2,23,3

    if (x.innerHTML.toLowerCase() > y.innerHTML.toLowerCase()) {
     //the x.innerHTML returns string
      shouldSwitch= true;
      break;
    }

你必须做这样的事情：

   if (parseInt(x.innerHTML) > parseInt(y.innerHTML)) {
      //if so, mark as a switch and break the loop:
      shouldSwitch= true;
      break;
    }

现在您要比较数字，我建议为数字列创建单独的函数sortNumbers，或保持相同的函数sortTable(0, type) - ＆gt; type参数可以接收文本或数字并进行相应的排序。

如果您需要更多解释，请与我们联系。希望这会有所帮助。

Answer 2

如果您坚持使用链接示例，请参阅此部分：

  if (dir == "asc") {
    if (x.innerHTML.toLowerCase() > y.innerHTML.toLowerCase()) {
      shouldSwitch= true;
      break;
    }
  } else if (dir == "desc") {
    if (x.innerHTML.toLowerCase() < y.innerHTML.toLowerCase()) {
      shouldSwitch= true;
      break;
    }
  }

它使用innerHTML，它始终是一个字符串，因此比较运算符执行字符串的比较（其中＆＃34; 11＆＃34;＆lt;＆＃34; 2＆＃34;）。要将数字内容与实际数字进行比较，必须先将其转换为数字（如果内容不是数字，则parseFloat会生成NaN对象，由isNaN()函数检查：

  var xNumeric = parseFloat(x.innerHTML);
  var yNumeric = parseFloat(y.innerHTML);

  if (dir == "asc") {
    if (!isNaN(xNumeric) && !isNaN(yNumeric) && xNumeric > yNumeric
        || (isNaN(xNumeric) || isNaN(yNumeric)) && x.innerHTML.toLowerCase() > y.innerHTML.toLowerCase()) {
      shouldSwitch= true;
      break;
    }
  } else if (dir == "desc") {
    if (!isNaN(xNumeric) && !isNaN(yNumeric) && xNumeric < yNumeric
        || (isNaN(xNumeric) || isNaN(yNumeric)) && x.innerHTML.toLowerCase() < y.innerHTML.toLowerCase()) {
      shouldSwitch= true;
      break;
    }
  }

其翻译为＆＃34;如果比较的内容是数字，则比较它们的数值或如果其中一个不是，则将它们作为字符串进行比较＆＃34;。

比较日期的方法是相同的 - 您首先将内容转换为日期对象（大约var xDate = new Date(x.innerHTML);，但这并非详尽无遗）并比较日期对象;检查变量是否是有效的日期对象有点困难，请检查this或that SO问题。

按编号对表格进行排序，不按字母顺序排列

2 个答案: