場景

某天領導提出要求：

表頭文字居中，序號、系統自動編碼、有規則約束的編碼、碼表關聯信息顯示樣式居中，金額、數量等右對齊，其他文字信息左對齊。

在DataTables中如何給每列添加樣式。

實現

?columns: [{ data: 'id',className :'badao_Center'},{ data: 'purchaseCode',className :'badao_Center' },{ data: 'deliveryTime',className :'badao_Center' ,render: function (data, type, full, meta ) {return moment(data).format("YYYY-MM-DD ");} },{ data: 'createrName',className :'badao_Center'? },//暫時先用創建人代替{ data: 'supplierCode',className :'badao_Center' },{ data: 'supplierName'? ,className :'badao_Left' },{ data: 'totalTray' ,className :'badao_Right'? },{ data: 'totalNum' ,className :'badao_Right' },{ data: 'deliveryCode',className :'badao_Center' },{ data: 'createrName' ,className :'badao_Center'},{ data: 'gmtCreat',className :'badao_Center' ,render: function (data, type, full, meta ) {return moment(data).format("YYYY-MM-DD");} },{ data: 'status',className :'badao_Center',render: function (data, type, full, meta ) {if(data.trim()=="1"){return '未提交'}else if(data.trim()=="2"){return '已提交'}else if(data.trim()=="3"){return '已打印'}else if(data.trim()=="4"){return '已入庫'}else{return '未知狀態'}}? },],

通過給columns里的每一列添加className屬性。

其中樣式名是在當前頁面的css文件中定義的。

.badao_Center{text-align: center;vertical-align: middle!important; } .badao_Right{text-align: right;vertical-align: middle!important; } .badao_Left{text-align: left;vertical-align: middle!important; }

?

總結

以上是生活随笔為你收集整理的DataTables中给某列添加样式的全部內容，希望文章能夠幫你解決所遇到的問題。

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