javascript - jQuery dataTables 自定义排序不适用于中文数字

Question

我创建了jsFiddle对于我的问题。

$.extend($.fn.dataTableExt.oSort, {
    "mysort-pre":  function (s)    { return s.replace(/(<([^>]+)>)/g, ''); },
    "mysort-asc":  function (a, b) { return a.localeCompare(b); },
    "mysort-desc": function (a, b) { return b.localeCompare(a); }
});
$(function(){
    $('table').dataTable({
        order: [[ 0, "asc" ]],
        columnDefs: [ { type: "mysort", targets: 0 } ]
    });
});

简而言之，在中文中，一/二/三表示1/2分别为/3。

默认情况下，它对二 > 三 > 一进行排序，所以我决定编写自己的排序。

数据字段中可能(不)有一些 HTML 标记，因此我在 '-pre' 函数中使用正则表达式来剥离它们。

对于'-asc'和'-desc'函数，我直接使用localCompare()，应该对三进行排序 > 二 > 一。

但是结果和我想象的不一样。

Answer 1

原因

以下是 DataTables 源代码的摘录:

Each ordering option can be described by three properties added to
this object:

• {type}-pre - Pre-formatting function
• {type}-asc - Ascending order function
• {type}-desc - Descending order function

All three can be used together, only {type}-pre or only {type}-asc and {type}-desc together. It is generally recommended that only {type}-pre is used, as this provides the optimal implementation in terms of speed, although the others are provided for compatibility with existing Javascript sort functions.

这意味着如果存在{type}-pre，则不会调用{type}-asc/{type}-desc .

此外，还有Chinese (string)排序插件已经可用，但它不会根据您的需要删除 HTML 标签。

解决方案

因此从技术上讲，您的排序插件应该如下所示编写，以排序和删除 HTML 标签。

$.extend($.fn.dataTableExt.oSort, {
    "mysort-asc":  function (a, b) { 
        a = a.replace(/<[^>]+>/g, '');
        b = b.replace(/<[^>]+>/g, '');
        return a.localeCompare(b, "zh-CN-u-co-stroke"); 
    },
    "mysort-desc": function (a, b) { 
        a = a.replace(/<[^>]+>/g, '');
        b = b.replace(/<[^>]+>/g, '');       
        return b.localeCompare(a, "zh-CN-u-co-stroke"); 
    }
});

演示

参见this jsFiddle用于演示。

注释

最初localCompare产生了意想不到的结果

• ('三').localeCompare('二') 返回 -1 这意味着 '三' <'二'.

当我将其更改为 ('三').localeCompare('二', "zh-CN-u-co-rinkle") 时，它产生了正确的结果。