最近做的项目，个人中心各个管理界面列表都应用DataTable，大部分第一列都是CheckBox，提供多选进行删除功能，这次做的功能表格不需要多选删除，第一列要显示行号，去掉CheckBox，以下是添加行号的代码：

//数据表格处理
        var table = $('#dataTable').DataTable({
            ajaxSource: "${ctx}/qindex/search",
            type:"post",
            bAutoWidth: false, //取消宽度自适应
            iDisplayLength: 5, //每页初始显示5条记录
            columns: [
        {  //行号
                className: "编号",
                orderable: false,
            data: null,
            sWidth:"5%",
            render: function (data, type, row, meta) {
            var no = meta.settings._iDisplayStart + meta.row + 1;
            return no;
        }},
                {data: "qiId", visible: false},
                {data: "name",orderable: false,sWidth:"40%"},//menuCatalogId
                {data: "typeName",orderable: false,sWidth:"15%"},
                {data: "sortPosition",orderable: false,sWidth:"10%"},
                {data: "stsDate",orderable: false,sWidth:"20%"},
                {createdCell: function (td, cellData, rowData, row, col) {
                        var operateHtml = "";
                        <shiro:hasPermission name="system:security:menu:edit">
                        if(operateHtml.length > 0) {operateHtml += "&nbsp;&nbsp;";}
                        operateHtml += "<i class='fa fa-pencil' onclick=\"editData('" + rowData.qiId + "')\"></i>";
                        </shiro:hasPermission>
                        <shiro:hasPermission name="system:security:menu:delete">
                        if(operateHtml.length > 0) {operateHtml += "&nbsp;&nbsp;";}
                        operateHtml += "<i class='fa fa-trash-o' onclick=\"deleteData('" + rowData.qiId + "')\"></i>";
                       </shiro:hasPermission>
                        $(td).html(operateHtml);
                    }, orderable: false
                }
            ],
            columnDefs: [
                {
                    defaultContent: "",
                    targets: "_all"
                }
            ],
            select: {
                style: 'multi',
                selector: 'td:first-child'
            },
            order: [[1, 'desc']]
        });

显示效果：

image.png