dataTables官網提供了一種方式，使用后沒有達到預期效果（js報錯），沒有深究原因。如果需要，可以按照下面的方式來。

1 $('#dataList').dataTable({ 2 "language": { 3 "sProcessing" : "<div ><img src='/NJLD_MONITOR/pt/common/images/load.gif'><span>計算中...</span></div>", 4 "lengthMenu" : "每頁顯示 _MENU_", 5 "zeroRecords" : "沒有找到記錄", 6 "info" : "_GOPAGE_ 當前 _PAGE_/ _PAGES_ 頁 共_TOTAL_條", 7 "infoEmpty" : "無記錄", 8 "infoFiltered" : "(從 _MAX_ 條記錄過濾)", 9 "oPaginate" : { 10 "sFirst" : "首頁", 11 "sPrevious" : "上一頁", 12 "sNext" : "下一頁", 13 "sLast" : "尾頁" 14 } 15 }, 16 "bLengthChange" : false, 17 "bInfo" : false, 18 "bPaginate" : false, 19 "sDom" : 'rt<"bottom "<"pCus "pli>>', 20 "bProcessing" : true, 21 "serverSide" : true, 22 "bSort" : false, 23 "sAjaxSource" : "/NJLD_MONITOR/ControlPlan/caculateLngLat.do", 24 "scrollY" : h, 25 "fnServerData" : retrieveData, 26 "fnServerParams" : function(aoData){ 27 aoData.push({"name":"startDate" ,"value" : $('#startDate').val()}), 28 aoData.push({"name":"days" ,"value" : $('#days option:selected').val()}) 29 }, 30 "fnDrawCallback" : function(){ 31 　　this.api().column(0).nodes().each(function(cell, i) { 32 　　　　cell.innerHTML = i + 1; 33 　　}); 34 }, 35 "aoColumns" : [ 36 { 37 "sTitle" : "序號", 38 "sClass" : "dt-center", 39 "bSortable" : false, 40 "sWidth" : "4%", 41 "data" : null, 42 "targets" : 0 43 }, 44 { 45 "sTitle" : "日期", 46 "mDataProp" : "date", 47 "sClass" : "dt-center", 48 "bSortable" : false, 49 "sWidth" : "12%" 50 },{ 51 "sTitle" : "開燈時間(日落)", 52 "mDataProp" : "sunrise", 53 "sClass" : "dt-center", 54 "bSortable" : false, 55 "sWidth" : "12%" 56 },{ 57 "sTitle" : "關燈時間(日出)", 58 "mDataProp" : "sunset", 59 "sClass" : "dt-center", 60 "bSortable" : false, 61 "sWidth" : "10%" 62 } 63 ] 64 });

重要的是這一段：

"fnDrawCallback" : function(){this.api().column(0).nodes().each(function(cell, i) {cell.innerHTML = i + 1;});},

效果：

?

注意，這段js可以會被IDE提示錯誤，不過不用管，可以正常運行。

原理就是每次填充一行時，先獲取這一行的第一列，賦值為序號。序號就是填充到第幾行了。

轉載于:https://www.cnblogs.com/zhengbn/p/5853611.html

總結

以上是生活随笔為你收集整理的jquery插件dataTables自增序号。的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。