jQuery tablesorter无法正确排序数字

gcxthw6b  于 2023-08-04  发布在  jQuery
关注(0)|答案(8)|浏览(128)

我已经尝试了几天,现在让jQuery表排序器正确排序我的表列中的数字。
我正在使用这两个脚本的当前最新版本。
表呈现正常,但对数字排序不正确。
当我对一个数字列进行排序时,它会给我以下结果:
8 7 4 32 31 3等。
你会期望:32 31 8等...
我读了一些关于添加额外JavaScript代码的评论,但我找不到任何好的javascript示例。
我现在使用的jQuery如下:

$(document).ready(function()
    {
      $("#table1")
       .tablesorter(
          {
            sortList: [[0,0]],
            widthFixed: true,
            widgets: ['zebra']
          } )
    }
);

字符串
下面是我的HTML:

<table id="table1" class=tablesorter>
    <thead>
        <tr>
            <th width=65>Name</th>
            <th width=40>Count</th>
        </tr>
     </thead>
     <tbody>
         <tr><td>Name_1</td><td>32</td></tr>
         <tr><td>Name_2</td><td>12</td></tr>
         <tr><td>Name_3</td><td>11</td></tr>
         <tr><td>name_4</td><td>14</td></tr>
         <tr><td>Name_5</td><td>7</td></tr>
         <tr><td>Name_6</td><td>3</td></tr>
         <tr><td>Name_7</td><td>32</td></tr>
         <tr><td>Name_8</td><td>31</td></tr>
         <tr><td>Name_9</td><td>35</td></tr>
      </tbody>
</table>

e5nqia27

e5nqia271#

<th width=110 class=\"{sorter: 'digit'}\">Count</th>

字符串
这就解决了问题。告诉JavaScript将值处理为数字,使排序工作正确。仍然有点愚蠢的是,在脚本中没有将数字值检查为数字。但我想最终会有更高的目的。
谢谢大家的时间和帮助
/Fons

6ie5vjzr

6ie5vjzr2#

希望这将帮助有人,如果他们发现这篇文章,在tablesorter你现在可以简单地使用。

$(".table").tablesorter({
     headers: {
         5: { sorter: 'digit' } // column number (starting with 0), type
     }
 });

字符串

t98cgbkg

t98cgbkg3#

这对其他人来说可能是显而易见的(对我来说不是),但要让解决方案与{排序器一起工作:'digit'}元数据,您需要使用jQuery metadata plugin

wr98u20j

wr98u20j4#

你也可以试试这个:

$(document).ready(function() { 
    $("table").tablesorter({ 
        // put other options here ...
        textExtraction: function(node) {  
            return parseInt($(node).text()); 
        } 
    }); 
});

字符串
.这在提取文本后将排序单元格的内容视为整数。

dgiusagp

dgiusagp5#

我知道这是一个老问题,但我遇到了同样的问题,而不是尝试任何解决方案张贴在这里,你应该首先检查你的插件的版本。当我发现我没有使用最新版本(2.0.5)时,所有问题都解决了

ercv8c1e

ercv8c1e6#

看起来你需要填补你的数字。这就解释了为什么8、7和4的顺序在32和31之前。
试试这个:

function padLeft(s,len,c){
  c=c || '0';
  while(s.length< len) s= c+s;
  return s;
}

$("table").tablesorter({
  textExtraction: function(node) {         
    return padLeft(node.innerHTML,2);
  } 
});

字符串
如果需要对较大的数字进行排序,请使用大于2的值。

x4shl7ld

x4shl7ld7#

你也能展示你的html吗?Tablesorter应该检测和处理数值排序,而不需要任何特殊选项。有没有可能你的数值被html包围了?在这种情况下,你可能需要一个custom method to extract的值从html。
引用链接中的示例:

$(document).ready(function() { 

    // call the tablesorter plugin 
    $("table").tablesorter({ 
        // define a custom text extraction function 
        textExtraction: function(node) { 
            // extract data from markup and return it  
            return node.childNodes[0].childNodes[0].innerHTML; 
        } 
    }); 
});

字符串

lpwwtiir

lpwwtiir8#

在jquery.tablesorter.js代码中查找:

this.isDigit = function(s,config) {

    var DECIMAL = '\\' + config.decimal;
    var exp = '/(^[+]?0(' + DECIMAL +'0+)?$)|(^([-+]?[1-9][0-9]*)$)|(^([-+]?((0?|[1-9][0-9]*)' + DECIMAL +'(0*[1-9][0-9]*)))$)|(^[-+]?[1-9]+[0-9]*' + DECIMAL +'0+$)/';

    return RegExp(exp).test($.trim(s));
};

字符串
并将其替换为:

this.isDigit = function(s,config) {

    var DECIMAL = '\\' + config.decimal;
    var exp = '/(^[+]?0(' + DECIMAL +'0+)?$)|(^([-+]?[1-9][0-9]*)$)|(^([-+]?((0?|[1-9][0-9]*)' + DECIMAL +'(0*[1-9][0-9]*)))$)|(^[-+]?[1-9]+[0-9]*' + DECIMAL +'0+$)/';

    //return RegExp(exp).test($.trim(s));
    return !isNaN(parseFloat($.trim(s))) && isFinite($.trim(s));
};

相关问题