jquery datatables的使用实例
来源:互联网 发布:詹姆斯09年对魔术数据 编辑:程序博客网 时间:2024/05/22 06:36
<script language="javascript" type="text/javascript" src="js/jquery/jquery-1.7.1.min.js"></script>
<script language="javascript" type="text/javascript" src="js/DataTables1.8.2/media/js/jquery.dataTables.min.js"></script>
<style type="text/css" title="currentStyle">
@import "js/DataTables-1.8.2/media/css/demo_page.css";
@import "js/DataTables-1.8.2/media/css/demo_table_jui.css";
@import "js/DataTables-1.8.2/examples/examples_support/themes/smoothness/jquery-ui-1.8.4.custom.css";
</style>
var oTableAll;
function fnGetSelected(oTableLocal) {
var aReturn = new Array();
var aTrs = oTableLocal.fnGetNodes();
for (var i = 0; i < aTrs.length; i++) {
if ($(aTrs[i]).hasClass('row_selected'))
{ aReturn.push(aTrs[i]); }
}
return aReturn;
}
function addtableClick(id, table) {
$("#" + id + " tbody").click(function (event) {
$(table.fnSettings().aoData).each(function ()
{ $(this.nTr).removeClass('row_selected'); });
$(event.target.parentNode).addClass('row_selected');
});
}
function InitExampleALL() {
oTableAll = $('#example1').dataTable({
"iDisplayLength": 10, //每页显示个数
"bScrollCollapse": true,
"bLengthChange": true, //每页显示的记录数
"bPaginate": true, //是否显示分页
"bFilter": true, //搜索栏
"bSort": true, //是否支持排序功能
"bInfo": true, //显示表格信息
"bAutoWidth": false, //自适应宽度
"bStateSave": false, //保存状态到cookie *************** 很重要 ,当搜索的时候页面一刷新会导致搜索的消失。使用这个属性就可避免了
"oLanguage": {
"sLengthMenu": "每页显示 _MENU_ 条记录",
"sZeroRecords": "对不起,查询不到任何相关数据",
"sInfo": "当前显示 _START_ 到 _END_ 条,共 _TOTAL_ 条记录",
"sInfoEmtpy": "找不到相关数据",