<thead>
<tr>
<th class="nosort">#</th>
<th>Name</th>
<th>Age</th>
<th>Location</th>
</tr>
</thead>
我有表,并且正在使用数据表,因此对列进行排序。我有一个 while 循环,可以生成以下单元格。
# | Name | Age| Location
----------------------------
1 | Donald | 37 | Sidney
2 | Janice | 54 | London
3 | Alice | 44 | California
# 在循环过程中会递增 i++。 DataTables 的“nosort”工作正常,我无法单击#。但是,例如,当我单击“名称”时,我想按“名称”对列进行排序,会发生以下情况。
# | Name | Age| Location
----------------------------
3 | Alice | 44 | California
1 | Donald | 37 | Sidney
2 | Janice | 54 | London
如您所见,# 根据名称“更改”。我希望用 i++ 创建的 # 列是固定的,只显示位置,这样当我按姓名或年龄排序时它就不会改变。我怎样才能实现这个目标?
编辑:我当前的代码
$('#example').dataTable({
"paging": false,
"info": false,
"bFilter": false,
"order": [[ 1, "asc" ]],
"columnDefs": [{ "targets": 'nosort' }]
});
最佳答案
我会使用 drawCallback
为此:
..
drawCallback: function() {
$('#example tbody tr').each(function(i, tr) {
tr.children[0].textContent = i+1;
})
}
..
演示 -> http://jsfiddle.net/hr8fy3vw/
由于该列的内容始终会重置,因此无需通过 API。另外,当使用 jQuery 迭代 <tr>
时仅处理可见行 - 与使用 API 的 every()
相比,可以节省时间。和each()
方法。
关于javascript - DataTables:按列对表进行排序,固定 i++ 值?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35368854/