我能够使用自定义功能(如下所示)来修改打印布局中的对齐方式,但不幸的是,这适用于整个表格及其所有列。
如何更改(我设置和选择的)各个列的打印对齐方式?
我当前的代码:
customize: function (win){ $(win.document.body).find('table').css('text-align', 'right'); },
Jsfiddle:
最佳答案
首先我尝试了这个,但它似乎没有用:
Js
"columnDefs": [ { className: "col_1",
"targets": [0] },
{ className: "col_2", "targets": [1] },
{ className: "col_3", "targets": [2] } ]
CSS
.dataTable tbody td.col_1 {
text-align: right;}
.dataTable tbody td.col_2 {
text-align: center;}
.dataTable tbody td.col_3 {
text-align: left;}
使用 columnDefs 在 JavaScript 中为列设置类,然后在 CSS 中为这些类设置样式只会影响 html 表格渲染本身,CSS 不会转移到打印布局。
不过我找到了解决办法。
通过在打印的自定义选项中使用此脚本代码:
customize: function (win){
$(win.document.body).find('table tbody td:nth-child(1)').css('text-align', 'right');
每列将设置第 n 个子项。
或者使用这种纯 CSS 方法:
.dataTable tbody tr td:nth-child(1) {
text-align: right;}
.dataTable tbody tr td:nth-child(2) {
text-align: center; }
.dataTable tbody tr td:nth-child(3) {
text-align: left; }
关于javascript - 如何更改 DataTables 中各个列的打印对齐方式?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45895181/