場(chǎng)景

某天領(lǐng)導(dǎo)提出要求：

表頭文字居中，序號(hào)、系統(tǒng)自動(dòng)編碼、有規(guī)則約束的編碼、碼表關(guān)聯(lián)信息顯示樣式居中，金額、數(shù)量等右對(duì)齊，其他文字信息左對(duì)齊。

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

實(shí)現(xiàn)

?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'? },//暫時(shí)先用創(chuàng)建人代替{ 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 '已入庫(kù)'}else{return '未知狀態(tài)'}}? },],

通過(guò)給columns里的每一列添加className屬性。

其中樣式名是在當(dāng)前頁(yè)面的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; }

?

總結(jié)

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

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。