基于关键字使用jQuery的HTML行排序

我需要使用特定关键字对HTML表进行排序。例如使用jQuery对“AX”，“BY”，“CZ”，“DQ”进行排序。我的表包含多个行与上述含有细胞的一个值基于关键字使用jQuery的HTML行排序

<table> 
<tr><td>Test1</td><td>BY</td></tr> 
<tr><td>Test2</td><td>AX</td></tr> 
<tr><td>Test3</td><td>DQ</td></tr> 
<tr><td>Test4</td><td>AX</td></tr> 
<tr><td>Test5</td><td>DQ</td></tr> 
<tr><td>Test6</td><td>CZ</td></tr> 
<tr><td>Test7</td><td>CZ</td></tr> 
<tr><td>Test8</td><td>AX</td></tr> 
</table>

表应重新安排如下：

<table> 
<tr><td>Test8</td><td>AX</td></tr> 
<tr><td>Test2</td><td>AX</td></tr> 
<tr><td>Test4</td><td>AX</td></tr> 
<tr><td>Test1</td><td>BY</td></tr> 
<tr><td>Test6</td><td>CZ</td></tr> 
<tr><td>Test7</td><td>CZ</td></tr> 
<tr><td>Test3</td><td>DQ</td></tr> 
<tr><td>Test5</td><td>DQ</td></tr> 
</table>

来源

2013-04-24 Girish Nair

你试过[搜索]（https://www.google.com/search?q=jquery+sort+table+based+on+values）？ – billyonecan 2013-04-24 11:07:50

Thankz但我完成了！ :) – 2013-04-29 06:32:16

$('TABLE > TBODY > TR > TD:nth-child(1)').each(function() { 
    var cellText = $.trim($(this).text()); 
    var row = $(this).closest("TR"); 
    switch (cellText) { 
     case AX: 
      SetPriority(row, 0); 
      break; 
     case BY: 
      SetPriority(row, 1); 
      break; 
     case CZ: 
      SetPriority(row, 2); 
      break; 
     case DQ: 
      SetPriority(row, 3); 
      break; 
     default: 
      SetPriority(row, 4); 
      break 
    } 
}); 

function SetPriority(row, priority) { 
    row.attr("RowIndex", priority); 
} 

var $table = $('TABLE'); 
var rows = $table.find('tr').get(); 

rows.sort(function (a, b) { 
    var keyA = $(a).attr('RowIndex'); 
    var keyB = $(b).attr('RowIndex'); 
    if (keyA < keyB) return -1; 
    if (keyA > keyB) return 1; 
    return 0; 
}); 

$.each(rows, function (index, row) { 
    $table.children('tbody').append(row); 
});

来源

2013-04-24 11:08:51 Durgesh

问题是关于基于预定义字符串的表行排序，无法使用比较运算符进行评估。 – Durgesh 2013-04-26 11:28:45

如果你希望允许用户进行排序，筛选等也许你应该考虑使用数据表，它会为你节省很多时间：http://www.datatables.net/ :)

来源

2013-04-24 11:08:57

你可以使用sort方法：

$('table tr').sort(function(a, b) { 
    return $('td:eq(1)', a).text() > $('td:eq(1)', b).text(); 
}).appendTo('tbody');

http://jsfiddle.net/NrUCw/

来源

2013-04-24 11:11:14 undefined

这将是明智的，给你的表中的ID：

<table id="mytable">

，那么你可以将元素进行排序，就像您使用谓词函数排序JavaScript数组：

Javascript

var keywordWeights = { "AX": 0, "BY": 1, "CZ": 2, "DQ": 3 }; 

$(function() { 
    $("#mytable tr").sort(function(a, b) { 
     var tagA = $("td:nth-child(2)", a).html(); 
     var tagB = $("td:nth-child(2)", b).html(); 
     weightA = tagA in keywordWeights ? keywordWeights[tagA] : Number.MAX_VALUE; 
     weightB = tagB in keywordWeights ? keywordWeights[tagB] : Number.MAX_VALUE; 
     return weightA - weightB; 
    }).appendTo("tbody"); 
});

See this jsFiddle

来源

2013-04-24 11:27:50

基于关键字使用jQuery的HTML行排序

回答

相关问题