2019獨(dú)角獸企業(yè)重金招聘Python工程師標(biāo)準(zhǔn)>>>

官網(wǎng)：Datatables官網(wǎng) 中文網(wǎng)：Datatables中文網(wǎng)

我用過的一些配置：

var table=$('#tableId').dataTable({"destroy": true,//是否需要重復(fù)渲染表格，若是則true."data": data,//數(shù)據(jù)來源，data來自上文ajax請求回掉函數(shù)中的data或定義在本地的data//ajax與上句的data有任何一個就可以了"ajax":{//datatable中的ajaxasync: true,//同步false異步trueurl:simMonitor.domain+"sim/searchSimBindState",dataSrc://dataSrc相當(dāng)于success，在datatable里面不能用success方法，會覆蓋datatable內(nèi)部回調(diào)方法function(data){//data即服務(wù)器返回的數(shù)據(jù)return data;//自定義數(shù)據(jù)源，默認(rèn)為data},type:"post",data:formData//ajax請求提交給服務(wù)器端的數(shù)據(jù)，一般是表單數(shù)據(jù)},"createdRow": function ( row, data, index ) {//該函數(shù)可對某指定行做操作，一般用于增加某種效果/* 設(shè)置表格中的內(nèi)容居中 */$('td', row).attr("class","text-center");//所有行，text-center的屬性需自己在相關(guān)css中自己寫$('td:nth-child(3)', row).attr("class","textLeft");//第3列$('td:nth-child(10)', row).attr("class","textLeft");//第10列},"bStateSave": false,//狀態(tài)保存，使用了翻頁或者改變了每頁顯示數(shù)據(jù)數(shù)量，會保存在cookie中，下回訪問時會顯示上一次關(guān)閉頁面時的內(nèi)容。這個數(shù)據(jù)是記錄在cookies中的，//打開了這個記錄后，即使刷新一次頁面，或重新打開瀏覽器，之前的狀態(tài)都是保存下來的，并且當(dāng)值為true時aoColumnDefs不能隱藏列"ordering":false,//排序功能"bAutoWidth":false,//寬度自適應(yīng)。一般禁止，使用不當(dāng)容易造成報錯。（目前我還沒有使用過）"searching":false,//右上角搜索框的顯示與否"bLengthChange": true,//左上角改變每頁顯示數(shù)據(jù)數(shù)量的顯示與否"sScrollX":true,//x軸滾動條，若是此項設(shè)置導(dǎo)致thead與tbody有間隙，可設(shè)置margin消除或在table的html中設(shè)置width="100%" cellspacing="0""bInfo": true,//頁腳信息的顯示與否"bPaginate" : true,//翻頁功能的顯示與否"sCharSet":"utf-8",//設(shè)置編碼格式"deferRender": true,//當(dāng)處理大數(shù)據(jù)時，延遲渲染數(shù)據(jù)，有效提高Datatables處理能力"oLanguage": {//設(shè)置語言"sLengthMenu": "每頁顯示 _MENU_ 條記錄","sZeroRecords": "抱歉， 沒有找到","sInfo": "從 _START_ 到 _END_ /共 _TOTAL_ 條數(shù)據(jù)","sInfoEmpty": "沒有數(shù)據(jù)","sInfoFiltered": "(從 _MAX_ 條數(shù)據(jù)中檢索)","oPaginate": {"sFirst": "首頁","sPrevious": "前一頁","sNext": "后一頁","sLast": "尾頁"},"sProcessing": true//"加載中...."的顯示與否},"columns":[//渲染列，一列一列將數(shù)據(jù)填充進(jìn)去，thead中標(biāo)識有多少列此處就寫多少列，并且將數(shù)據(jù)填充進(jìn)去，數(shù)據(jù)來源于上文的data，函數(shù)中的row即data{"data":function(row){cellData=(row.operator == "" || row.operator == null) ? "--":row.operator;return cellData;},"type" : "string"}//其他列data省略....],"rowCallback": function( row, data ) {//行的回調(diào)函數(shù)$(row.cells[13]).click(function(){console.log(data);//每行的第13個子元素（列）被點(diǎn)擊之后，會打印出該行的所有值（不僅僅是顯示的，而是data返回給該行的所有數(shù)據(jù)）});}});

轉(zhuǎn)載于:https://my.oschina.net/AnymoreCoder/blog/801298

總結(jié)

以上是生活随笔為你收集整理的jQuery Datatables常用配置的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。