数据表循环遍历所有表行,只循环当前显示的表行
datatables loop through all table rows, only did loop on the currently shown table rows
我试图循环到数据表表上的所有表行,但只循环到当前显示的表行,如我有100条记录(100个表行),目前显示10个表行,不幸的是,它只循环到10个表行。
我使用下面的代码循环遍历每个表行
$("#admin_user_table tbody tr").each(function(){
alert("yes");
});
有什么想法、帮助、线索、建议、建议吗?更具体地说,下面的是我的小提琴。
$(document).ready(function(){
$('#sample_table').DataTable( {
"bSort": false,
"pagingType": "full_numbers",
"dom": 'T<"clear">lfrtip',
});
$("#test_loop").click(function(){
$("#sample_table tbody tr").each(function(){
alert("table row");
});
});
});
table{width: 100%}table td, table th{padding: 7px; text-align: center; vertical-align: middle}table thead{border-bottom: 2px solid #cccccc;}table tbody tr{border-bottom: 1px solid #ccc;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdn.datatables.net/r/dt/dt-1.10.8/datatables.min.css" rel="stylesheet"/>
<script src="https://cdn.datatables.net/r/dt/dt-1.10.8/datatables.min.js"></script>
<table cellpadding="0" cellspacing="0" id="sample_table">
<thead>
<tr>
<th>Name</th>
<th>Position</th>
<th>Branch</th>
<th>Department</th>
</tr>
</thead>
<tbody>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td>
</tr>
</tbody>
</table>
<button id="test_loop">Loop through all the table rows</button>
您可以使用原始过滤器
$.fn.dataTable.ext.search.push(
function( settings, data, dataIndex ) {
var enabled = $('#my-filter').is(':checked');
return !enabled || /raw$/g.test(data[1]);
}
);
$(document).ready(function() {
var table = $('#sample_table').DataTable({
"bSort": false,
"pagingType": "full_numbers",
"dom": 'T<"clear">lfrtip',
});
$("#my-filter").change(function() {
table.draw();
});
});
table {
width: 100%
}
table td,
table th {
padding: 7px;
text-align: center;
vertical-align: middle
}
table thead {
border-bottom: 2px solid #cccccc;
}
table tbody tr {
border-bottom: 1px solid #ccc;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdn.datatables.net/r/dt/dt-1.10.8/datatables.min.css" rel="stylesheet" />
<script src="https://cdn.datatables.net/r/dt/dt-1.10.8/datatables.min.js"></script>
<table cellpadding="0" cellspacing="0" id="sample_table">
<thead>
<tr>
<th>Name</th>
<th>Position</th>
<th>Branch</th>
<th>Department</th>
</tr>
</thead>
<tbody>
<tr>
<td>Sample Name 1</td>
<td>Sample raw</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample raw</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample raw</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample raw</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample raw</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample raw</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample raw</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample raw</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample raw</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample raw</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample raw</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
<tr>
<td>Sample Name 1</td>
<td>Sample position</td>
<td>sample branch</td>
<td>sample department</td>
</tr>
</tbody>
</table>
<input id="my-filter" type="checkbox" />
相关文章:
- 在 Javascript 中循环显示书籍;
- Javascript do/while循环显示意外结果
- 在 Google 云端硬盘上托管素材资源,循环显示
- JavaScript 选择列表,循环显示选项
- 如何循环显示来自跟踪路由输出的谷歌地图v3中的标记
- 摘要循环显示我的数组没有变化(视图不会刷新)
- 在下拉列表中循环显示年份
- jQuery每个循环-显示单个项目
- jQuery循环显示文本
- 智能电视应用程序(css和Javascript)-如何循环显示视频流和循环登录
- hangman-can'我无法让我的循环显示正确答案
- 从http服务器获取图像并在智能电视中循环显示
- 使用循环显示数据的Ajax
- 当绘制许多d3 SVG对象时更新循环显示
- 我如何让Javascript for循环显示它已经循环的次数与实时计数
- jQuery与Wordpress循环.显示/隐藏内容
- Javascript循环显示文档中的隐藏元素(Jquery也可以)
- 单击时图像应循环显示
- 使用循环显示一系列数字,并在按下键盘键时退出
- Javascript 嵌套的循环显示来自 JSON 对象数组的数据