jQuery Datatables常用配置

2019独角兽企业重金招聘Python工程师标准>>>

官网：Datatables官网 中文网：Datatables中文网

我用过的一些配置：

var table=$('#tableId').dataTable({"destroy": true,//是否需要重复渲染表格，若是则true."data": data,//数据来源，data来自上文ajax请求回掉函数中的data或定义在本地的data//ajax与上句的data有任何一个就可以了"ajax":{//datatable中的ajaxasync: true,//同步false异步trueurl:simMonitor.domain+"sim/searchSimBindState",dataSrc://dataSrc相当于success，在datatable里面不能用success方法，会覆盖datatable内部回调方法function(data){//data即服务器返回的数据return data;//自定义数据源，默认为data},type:"post",data:formData//ajax请求提交给服务器端的数据，一般是表单数据},"createdRow": function ( row, data, index ) {//该函数可对某指定行做操作，一般用于增加某种效果/* 设置表格中的内容居中 */$('td', row).attr("class","text-center");//所有行，text-center的属性需自己在相关css中自己写$('td:nth-child(3)', row).attr("class","textLeft");//第3列$('td:nth-child(10)', row).attr("class","textLeft");//第10列},"bStateSave": false,//状态保存，使用了翻页或者改变了每页显示数据数量，会保存在cookie中，下回访问时会显示上一次关闭页面时的内容。这个数据是记录在cookies中的，//打开了这个记录后，即使刷新一次页面，或重新打开浏览器，之前的状态都是保存下来的，并且当值为true时aoColumnDefs不能隐藏列"ordering":false,//排序功能"bAutoWidth":false,//宽度自适应。一般禁止，使用不当容易造成报错。（目前我还没有使用过）"searching":false,//右上角搜索框的显示与否"bLengthChange": true,//左上角改变每页显示数据数量的显示与否"sScrollX":true,//x轴滚动条，若是此项设置导致thead与tbody有间隙，可设置margin消除或在table的html中设置width="100%" cellspacing="0""bInfo": true,//页脚信息的显示与否"bPaginate" : true,//翻页功能的显示与否"sCharSet":"utf-8",//设置编码格式"deferRender": true,//当处理大数据时，延迟渲染数据，有效提高Datatables处理能力"oLanguage": {//设置语言"sLengthMenu": "每页显示 _MENU_ 条记录","sZeroRecords": "抱歉， 没有找到","sInfo": "从 _START_ 到 _END_ /共 _TOTAL_ 条数据","sInfoEmpty": "没有数据","sInfoFiltered": "(从 _MAX_ 条数据中检索)","oPaginate": {"sFirst": "首页","sPrevious": "前一页","sNext": "后一页","sLast": "尾页"},"sProcessing": true//"加载中...."的显示与否},"columns":[//渲染列，一列一列将数据填充进去，thead中标识有多少列此处就写多少列，并且将数据填充进去，数据来源于上文的data，函数中的row即data{"data":function(row){cellData=(row.operator == "" || row.operator == null) ? "--":row.operator;return cellData;},"type" : "string"}//其他列data省略....],"rowCallback": function( row, data ) {//行的回调函数$(row.cells[13]).click(function(){console.log(data);//每行的第13个子元素（列）被点击之后，会打印出该行的所有值（不仅仅是显示的，而是data返回给该行的所有数据）});}});

转载于:https://my.oschina.net/AnymoreCoder/blog/801298

总结

以上是生活随笔为你收集整理的jQuery Datatables常用配置的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。