DataTables 无法对 Edge 中的 'date' 列类型进行排序

Question

当使用 columnDefs 将列类型设置为 'date' 时，排序中断，但仅限于 Edge。 Firefox 和 Chrome 继续按预期运行。

不会抛出任何错误，如果我删除类型，它会重新启用按字母数字排序。

谁能告诉我为什么会发生这种情况以及我该如何解决？

下面可精确重现的示例：

<!DOCTYPE html>
<html>
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
  <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css">
</head>
<body>
  <table id='target'>
    <thead>
      <tr>
        <th>Foo</th>
        <th width='200'>date</th>
        <th>bar</th>
      </tr>
    </thead>
  </table>
  <script>
    console.log('script start');
      $('#target').DataTable({
        'pageLength': 100,
        'lengthMenu': [100, 150, 200],
        'data': [
          ['aaa', '30-Nov-2020', 'ccc'],
          ['aaa', '03-Nov-2020', 'ccc'],
          ['aaa', '31-Oct-2020', 'ccc'],
          ['aaa', '30-Oct-2020', 'ccc'],
          ['aaa', '06-Oct-2020', 'ccc'],
          ['aaa', '30-Sep-2020', 'ccc'],
          ['aaa', '30-Sep-2020', 'ccc'],
          ['aaa', '15-Sep-2020', 'ccc']
        ],
           "columnDefs": [
          {
            "targets": 1,
            "type": "date"
          }
        ]
      });
  </script>
</body>
</html>

Answer 1

如果问题仍然存在，那么您也可以参考此示例在 MS Edge 浏览器上运行良好。

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" />
    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.4/moment.min.js"></script>
    <script src="http://cdn.datatables.net/plug-ins/1.10.19/sorting/datetime-moment.js"></script>
    <script>
        $(function () {
            $.fn.dataTable.moment("DD/MM/YYYY HH:mm a");
            $('#example').DataTable({
                "scrollX": true,
                "order": [[2, "desc"]]
            });
        })
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <table id="example" class="display" style="width: 100%">
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Company</th>
                    <th>Time</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>Tiger Nixon</td>
                    <td>System Architect</td>
                    <td>16/05/2017 05:44 pm</td>
                </tr>
                <tr>
                    <td>Garrett Winters</td>
                    <td>Accountant</td>
                    <td>15/05/2017 05:43 pm</td>
                </tr>
                <tr>
                    <td>Ashton Cox</td>
                    <td>Junior Technical Author</td>
                    <td>12/02/2017 05:43 pm</td>
                </tr>
                <tr>
                    <td>Cedric Kelly</td>
                    <td>Senior Javascript Developer</td>
                    <td>13/05/2017 05:45 am</td>
                </tr>
                <tr>
                    <td>Airi Satou</td>
                    <td>Accountant</td>
                    <td>11/05/2017 05:41 pm</td>
                </tr>
                <tr>
                    <td>Brielle Williamson</td>
                    <td>Integration Specialist</td>
                    <td>13/05/2017 05:41 pm</td>
                </tr>
                <tr>
                    <td>Herrod Chandler</td>
                    <td>Sales Assistant</td>
                    <td>12/05/2017 05:41 pm</td>
                </tr>
            </tbody>
        </table>
    </form>
</body>
</html>

输出：

DataTables 无法对 Edge 中的 'date' 列类型进行排序

DataTables cannot sort 'date' column type in Edge

javascript

datatables

datatables-1.10

microsoft-edge