jquery DataTable 漢化 以及其他實用配置

2021-7-7    前端達(dá)人

一、將 DataTable 設(shè)置成中文

復(fù)制代碼 
<script> $('#datatable').DataTable({

   language: { "sProcessing": "處理中...", "sLengthMenu": "顯示 _MENU_ 項結(jié)果", "sZeroRecords": "沒有匹配結(jié)果", "sInfo": "顯示第 _START_ 至 _END_ 項結(jié)果，共 _TOTAL_ 項", "sInfoEmpty": "顯示第 0 至 0 項結(jié)果，共 0 項", "sInfoFiltered": "(由 _MAX_ 項結(jié)果過濾)", "sInfoPostFix": "", "sSearch": "搜索:", "sUrl": "", "sEmptyTable": "表中數(shù)據(jù)為空", "sLoadingRecords": "載入中...", "sInfoThousands": ",", "oPaginate": { "sFirst": "首頁", "sPrevious": "上頁", "sNext": "下頁", "sLast": "末頁" }, "oAria": { "sSortAscending": ": 以升序排列此列", "sSortDescending": ": 以降序排列此列" }
   }
});
}); </script>
復(fù)制代碼

 

二、設(shè)置列寬度

復(fù)制代碼 
<script>
$('#datatable').DataTable({

"columnDefs": [
  {
    render: function (data, type, full, meta) {
        return "<div style='white-space:nowrap;float:right'>" + data + "</div>";
    },
    targets: [2,3,4,5,6]
  },
],

}); 

</script>
復(fù)制代碼

 

三、修改表格數(shù)據(jù)后，靜態(tài)刷新表格數(shù)據(jù)不跳轉(zhuǎn) 

dataTable.ajax.reload(null, false);

  

// 重載所有接口數(shù)據(jù)，返回到第一頁
dataTable.ajax.reload();

 

相關(guān) API

ajax.reload( callback, resetPaging )


里面有二個參數(shù)：
callback ：當(dāng)服務(wù)器返回數(shù)據(jù)并重繪完畢時執(zhí)行此回調(diào)方法，回調(diào)方法返回的是服務(wù)器返回的數(shù)據(jù)
resetPaging： 重置（默認(rèn)或者設(shè)置為true）或者保持分頁信息（設(shè)置為false） 


藍(lán)藍(lán)設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請掃碼藍(lán)小助，報下信息，藍(lán)小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。

截屏2021-05-13 上午11.41.03.png


分享此文一切功德，皆悉回向給文章原作者及眾讀者.

免責(zé)聲明：藍(lán)藍(lán)設(shè)計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計( bouu.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

分享本文至：

日歷

鏈接

個人資料

存檔