用html和Javascript進行客戶端排序

Question

如何製作一個html表格，用戶可以使用列標題對客戶端進行排序？我可以將所有行的html數據加載到Javascript數組中，並使用dom將表添加到內容div，但這是否正確？如果列出主要方法，我可以從中找到我的方法，所以我不要求代碼。

Answer 1

您可能需要使用tablesorter，這是客戶端的表格排序jQuery插件..

Answer 2

的tablesorter是好的，但你想已濾波內置的東西，是相當廣泛的應用，並支持嘗試http://datatables.net/

Answer 3

如果你有一個數組，然後調用sort()可能是你最好的選擇：

function sortArray(a, b){ 
    //could also say return a-b instead of the blown out if...else construct 
    if(a.Age===b.Age) { return 0; } 
    else if (a.Age < b.Age) { return -1; } 
    else { return 1; } 
} 

var rows = [{Name: 'Amy', Age: 10}, {Name: 'Bob', Age: 20}]; 
var sortedArray = rows.sort(sortArray); 

至於其他的答案都表示，你也可以使用一個插件。 DataTables是我以前用過的很好的一個。

Answer 4

http://tinysort.sjeiti.com/應該是有益

Answer 5

無需推倒重來的情況下，你利用JS框架了，但這裏有相當一些不錯的解決方案：

TableSort - http://www.frequency-decoder.com/demo/table-sort-revisited/

的JQuery tablesorter - http://tablesorter.com/docs/#Demo

GridView3 - http://dev.sencha.com/playpen/ext-2.0/examples/grid/grid3.html

斯圖爾特Langridge的腳本 - http://yoast.com/articles/sortable-table/

Mootools的Mootable - http://joomlicious.com/mootable/

Answer 6

每天的tablesorter是這樣工作的：

1. 得到一個數組的table.tbody.rows
2. 排序使用custom compare function
3. 該數組追加的行的表體以正確的順序

它通常是有點快如果預先計算的值到比較（而不是訪問DOM元素在每個比較中），數組將包含具有一個槽中值的對象和另一個槽中的錶行元素。