我正在尋找一種方法來排除單個列使用jQuery的tablesorter插件排序。具體來說，我有一個相當大的表，並希望保持「行號」列固定，以便在排序後很容易看到表中特定行的位置。排除列使用jQuery tablesorter排序
例如：
# name
-----------
1 papaya
2 apple
3 strawberry
4 banana
當排序上的名字一欄，應導致：
# name
-----------
1 apple
2 banana
3 papaya
4 strawberry
感謝。
這裏是一個小部件，你可以使用，將完成你在找什麼：
$(function() {
// add new widget called indexFirstColumn
$.tablesorter.addWidget({
// give the widget a id
id: "indexFirstColumn",
// format is called when the on init and when a sorting has finished
format: function(table) {
// loop all tr elements and set the value for the first column
for(var i=0; i < table.tBodies[0].rows.length; i++) {
$("tbody tr:eq(" + i + ") td:first",table).html(i+1);
}
}
});
$("table").tablesorter({
widgets: ['zebra','indexFirstColumn']
});
});
Hrm。從tablesorter的重組表格的方法來看，我很確定這不是完全可能的。 Tablesorter逐一跳出DOM，並根據索引字段對它們進行排序，重新插入整個tr，而不以任何方式更改tr的內容。然後，您需要的解決方案需要在每次排序後迭代遍歷表並重新枚舉第一列。 Tablesorter確實有一個插件方法，供斑馬紋和其他擴展使用。也許這可以用來鉤住排序方法？
編輯：我在http://jsbin.com/igupu4/3使這個技術的一個樣本。點擊任一列標題，按...
雖然我沒有回答你關於jQuery的問題，這裏有一個替代的方式來獲得分類後，你在這裏所描述的具體行爲，固定的行號。 （使用CSS，特別是content property，並且counter related properties/functions）
<html>
<head>
<title>test</title>
<style type="text/css">
tbody tr
{
counter-increment : rownum ;
}
tbody
{
counter-reset: rownum;
}
table#sample1 td:first-child:before
{
content: counter(rownum) " " ;
}
table#sample2 td.rownums:before
{
content: counter(rownum) ;
}
</style>
<script src="jquery-1.2.6.min.js" ></script>
<script src="jquery.tablesorter.min.js" ></script>
<script>
$(document).ready(function()
{
$("table").tablesorter();
}
);
</script>
</head>
<body>
<table id="sample1">
<thead>
<tr>
<th>Col 1</th>
<th>Col 2</th>
</thead>
<tbody>
<tr>
<td>
<p>foo</p>
</td>
<td>
<p>quuz</p>
</td>
</tr>
<tr>
<td>bar</td>
<td>quux</td>
</tr>
<tr>
<td>baz</td>
<td>baz</td>
</tr>
</tbody>
</table>
<table id="sample2">
<thead>
<tr>
<th>Rownums</th>
<th>Col 1</th>
<th>Col 2</th>
<th>More Rownums</th>
</thead>
<tbody>
<tr>
<td class="rownums"></td>
<td>
<p>foo</p>
</td>
<td>
<p>bar</p>
</td>
<td class="rownums"></td>
</tr>
<tr>
<td class="rownums"></td>
<td>quuz</td>
<td>baz</td>
<td class="rownums"></td>
</tr>
<tr>
<td class="rownums"></td>
<td>fred</td>
<td>quux</td>
<td class="rownums"></td>
</tr>
</tbody>
</table>
</body>
</html>
如果你的瀏覽器足夠CSS2.1兼容，可以使用TR：之前不是TD：第一孩子：之前在樣品1（Mozilla only supports this in trunk for now... ）
在示例2中，您可以看到如何在任何地方定位行號列，而不僅僅是第一列。
對於那些誰發現這個在尋找一種方式來被排序（即點擊列標題）排除一列，下面的示例中不包括第4列（零索引）被排序）：
$("table").tablesorter({
headers: {4: {sorter: false}}
});
這將跳過第一列的排序，並允許第二列排序。對於從第一列開始爲零的所有列，只需設置true/false即可。
<script>
$(document).ready(function() {
$("table").tablesorter({
headers: {
0: {sorter: false},
1: {sorter: true},
3: {sorter: false}
}//headers
});
});
</script>
布賴恩費舍爾的答案是正確的，但它在大型表格（在我的例子中是+1600行）太慢了。我改進了遍歷每一行的方式。其他一切都是一樣的。
$(function() {
// add new widget called indexFirstColumn
$.tablesorter.addWidget({
// give the widget a id
id: "indexFirstColumn",
// format is called when the on init and when a sorting has finished
format: function(table) {
// loop all tr elements and set the value for the first column
$(table).find("tr td:first-child").each(function(index){
$(this).text(index+1);
})
}
});
$("table").tablesorter({
widgets: ['zebra','indexFirstColumn']
});
});
$("table").tablesorter({
headers: {4: {sorter: false},8: {sorter: false}}
});
Stobor的答案是完美的。唯一的問題是，需要等到桌子完全呈現才能放入數字。
一些觀察：
注： 阿卜杜勒所示的方法只限制用戶必須通過指定的列進行排序，但在選擇其他不受限制的列的順序他的內容總是與該行的其餘部分進行排序。
非常好！我認爲在for循環中應該有'<='而不是'<'。 – Marcin 2010-03-21 06:50:32