【bootstrap -datatabale】 bootstrap datatabale页面展示序号问题解决方案

今天同事问了我一个bootstrap datatable列表展示需要的问题，到官网看了一下教程，然后在自己的项目中测试了一下，没有效果，然后开始了百度搜索，针对序号的问题，众说纷纭，代码也是各式各样的，通过认真研究，终于找到了解决方案，请看下面的代码内容：

 interTable = $('#interTable').dataTable({
            "bPaginate": false,
            "bLengthChange": false,
            "bFilter": false,
            "bSort": false,
            "bAutoWidth": false,
            "paging": true, //分页
            "bProcessing": false,// 是否显示取数据时的那个等待提示
            "iDisplayLength": 10, //默认条数
            "oLanguage": { // 国际化配置
                "sProcessing": "正在获取数据，请稍后...",
                "sLengthMenu": "显示 _MENU_ 条",
                "sZeroRecords": "没有找到数据",
                "sInfo": "从 _START_ 到  _END_ 条记录 总记录数为 _TOTAL_ 条",
                "sInfoEmpty": "记录数为0",
                "sInfoFiltered": "(全部记录数 _MAX_ 条)",
                "sInfoPostFix": "",
                "oPaginate": {
                    "sFirst": "第一页",
                    "sPrevious": "上一页",
                    "sNext": "下一页",
                    "sLast": "最后一页"
                }
            },
            "bServerSide": false,
            "sAjaxSource": "/demand/list",
            "sAjaxDataProp": "data",
            "fnServerData": loadData, // 获取数据的处理函数
            "aoColumns": [
				{
					sTitle: '序号',
					data: null,
					className: 'text-center whiteSpace',
					render:function(data,type,row,meta) {
						return meta.row + 1 + meta.settings._iDisplayStart;
					}
				},
                {'mData': 'id', 'sTitle': '需求ID', 'sName': 'id'},
         //       {'mData': 'xuhao', 'sTitle': '需求ID', 'sName': 'xuhao'},
                {'mData': 'name', 'sTitle': '需求名称', 'sName': 'name'},
                {'mData': 'type', 'sTitle': '需求类型', 'sName': 'type'},
                {'mData': 'application', 'sTitle': '上线应用', 'sName': 'application'},
                {'mData': 'status', 'sTitle': '需求状态', 'sName': 'status'},
        //        {'mData': 'priority', 'sTitle': '优先级', 'sName': 'priority'},
        //        {'mData': 'flow', 'sTitle': '切量开关', 'sName': 'flow'},
                {'mData': 'product', 'sTitle': '产品', 'sName': 'product'},
                {'mData': 'development', 'sTitle': '开发', 'sName': 'development'},
                {'mData': 'test', 'sTitle': '测试', 'sName': 'test'},
                {'mData': 'developmenttime', 'sTitle': '开发时间', 'sName': 'developmenttime'},
                {'mData': 'testtime', 'sTitle': '测试时间', 'sName': 'testtime'},
                {'mData': 'linetime', 'sTitle': '预计上线时间', 'sName': 'linetime'},
                {'mData': 'actualtime', 'sTitle': '实际上线时间', 'sName': 'actualtime'},
                {'mData': 'isfinish', 'sTitle': '需求进度', 'sName': 'isfinish'},
                {'mData': 'id', 'sTitle': '操作', 'sName': 'id'}
            ],
            "aoColumnDefs": [
                {
                    "aTargets": [-1], "mRender": function (data, type, full) {
                    return "<button style='margin-right: 3px;' class='btn btn-primary' title='编辑' data-toggle=\"modal\" data-target=\"#modal-inter-edit\" οnclick='editFun(" + data + ")' type='button'><i class='fa fa-edit'></i></button>" +
                            "<button style='margin-right: 3px;' class='btn btn-primary' title='提测' data-toggle=\"modal\" data-target=\"#modal-inter-sendEmail\" οnclick='sendEmai(" + data + ")' type='button'><i class='fa fa-envelope'></i></button>" +
                   //         "<button class='btn btn-danger' οnclick='(" + data + ")' title='删除' type='button'><i class='fa fa-trash-o'></i></button>";+
                            "<button class='btn btn-danger' οnclick='delFun(" + data + ")' title='删除' type='button'><i class='fa fa-trash-o'></i></button>";
                }
                },
                {
                    "aTargets": [13], "mRender": function (data, type, full) {
                    if (full.isfinish == '是') {
                        return "<span class='label label-success'>正常</span>";
                    } else {
                        return "<span class='label label-danger'>延期</span>";
                    }
                }
                },
                {
                    "aTargets": [1], "mRender": function (data, type, full) {
                    return "<a style='cursor:pointer;' οnclick='detail(" + full.id + ")' data-toggle=\"modal\" data-target=\"#modal-inter-detail\" >" + data + "</a>";
                }
                }
            ]
        });

只需要在aoColumns节点添加这段代码即可

{
					sTitle: '序号',
					data: null,
					className: 'text-center whiteSpace',
					render:function(data,type,row,meta) {
						return meta.row + 1 + meta.settings._iDisplayStart;
					}
				},

展示效果如下：