使用jquery或Javascript自定义表排序

我有下表有三列（ID，日期和来源）。 我想根据源列对此表进行排序。 我不想按字母或数字排序。 我希望它们排序，就像来自ON源的所有行将首先出现在表中，然后是MB源中的所有行，依此类推使用Javascript或jquery 。 我搜索了几乎所有与排序相关的线程。 但我没能解决这个问题。 我是新手，所以请帮助我完成这件事。 非常感谢您的帮助。

 
 
ID
 
Date
 
Source
 
 
 
50
 
2012-01-01
 
ON
 
 
 
94
 
2013-06-05
 
MB
 
 
 
80
 
2011-07-08
 
AB
 
 
 
50
 
2012-01-01
 
ON
 
 
 
50
 
2012-01-01
 
MB
 
  

Answer 1

由于源已知可以生成顺序数组并使用该数组索引进行排序

 var sorters =['ON','AB','MB'] var $rows = $('tr:gt(0)').sort(function(a, b){ var aSrcIdx =sorters.indexOf( $(a).find('td:last').text() ); var bSrcIdx = sorters.indexOf( $(b).find('td:last').text()); return aSrcIdx > bSrcIdx; }); $('table').append($rows); 

我单独留下了html，但它肯定可以通过数据属性进行改进，以提高效率

DEMO

Answer 2

好的，这就是我做过这样的事情。 给定元素data- *属性，其优先级的整数值。

然后使用js’sing sort()函数对它们进行sort()如下所示：

 $(elementsToBeSorted).sort(function(a, b){ return $(a).attr('data-priority') - $(b).attr('data-priority'); }).appendTo('body'); 

在你的情况下，你可以做这样的事情：

 $('tr').not($('.th').parents('tr')).sort(function(a, b){ return $(a).children('td').last().text() - $(b).children('td').last().text(); }).appendTo('table'); 

这将对最后一个table-data元素中不包含标题的所有行进行排序。

Answer 3

我建议在将源数据放入DOM之前对其进行排序。 假设data是要显示的数组，您可以编写如下内容：

 var data = [ {id: 50, date: '2012-01-01', source: 'ON'}, {id: 94, date: '2013-06-05', source: 'MB'} ]; var sortedData = data.sort(function (a, b) { var weights = ['ON','MB']; return weights.indexOf(a.source) - weights.indexOf(b.source); }); 

这样，数组sortedData将按照weights中元素的顺序排序。