Javascript datatables打印时未正确显示列表元素

我有一个包含列表元素的单元格的表格，问题是当我打印表格时，我丢失了列表元素，文本变得很难阅读。请看图片

这里是我的js创建一个datatable，你可以只关注按钮部分

    $(document).ajaxSuccess(function() {
    qxGenerateDataTables();

});

function qxGenerateDataTables() {
    $("table.dataTable:not(table.dataTableProcessed)").each(function() {
        var $this = $(this);
        var paganation = !$this.hasClass("no-pagination");
        var title = $this.attr ("data-file-name");
        var excel= !$this.hasClass("no-excel");
        var table = $this.DataTable({
            "bPaginate": paganation,
            "bSort": true,
            stateSave: true,
            ordering : true,
            searching: true,
            fixedHeader: true,
            columnDefs : [ {
                orderable : false,
                targets : "no-sort"
            } ]
        ,
        dom:'B<"wrapper"iftlp>',
        buttons: [
            {
                extend:    'excelHtml5',
                text:      '<i style="font-size:24px;color:#337ab7" class="fa fa-file-excel-o fa-2x"></i>',
                titleAttr: 'Excel',
                title:  title,
                customize: function( xlsx ) {
                    var sheet = xlsx.xl.worksheets['sheet1.xml'];
                    $('row:first c', sheet).attr( 's', '55' );

                }
            }, 
            {
                extend: 'print',
                text: '<i style="font-size:24px;color:#337ab7" class="fa fa fa-print fa-2x"></i>'
            }
        ]

        });
        table.buttons().container().appendTo( '#qxDatatable_wrapper .col-sm-6:eq(0)' );

        //Surround the table with an outer div, to have the horizontal scroll working properly.
        var wrapperDiv = $("<div>", {style:"overflow:auto; width: 100%;"});
        $this.before(wrapperDiv);
        wrapperDiv.append($this);
        //Mark this table as processed.
        $this.addClass('dataTableProcessed');
        //Just hide the button for now until we find a better way.
        if (!excel){
            $('.fa-file-excel-o').css( 'display', 'none' );
        }

        //Hide the table info if pagination is disabled...
        if (!paganation){
            $('.dataTables_info').css( 'display', 'none' );
        }

    });
}

$（文档）.ajaxSuccess（函数（）{
qxGenerateDataTables（）；
});
函数qxGenerateDataTables（）{
$（“table.dataTable:not（table.dataTableProcessed）”）。每个（函数（）{
var$this=$（this）；
var pagination=！$this.hasClass（“无分页”）；
var title=$this.attr（“数据文件名”）；
var excel=！$this.hasClass（“无excel”）；
var table=$this.DataTable({
“bPaginate”：分页，
“bSort”：正确，
stateSave：没错，
顺序：对，
搜索：是的，
fixedHeader:true，
columnDefs:[{
可订购：错误，
目标：“没有排序”
} ]
,
dom:'B'，
按钮：[
{
扩展：“excelHtml5”，
文本：“”，
标题：“Excel”，
标题:标题,，
自定义：功能（xlsx）{
var sheet=xlsx.xl.worksheets['sheet1.xml']；
$（'row:first c'，sheet）.attr（'s'，'55'）；
}
}, 
{
扩展：“打印”，
文本：“”
}
]
});
table.buttons（）.container（）.appendTo（“#qxDatatable_wrapper.col-sm-6:eq（0）”；
//用一个外刻度盘环绕桌子，使水平卷轴正常工作。
var wrapperDiv=$（“”，{style:“溢出：自动；宽度：100%；”}）；
$this.before（wrapperDiv）；
append（$this）；
//将此表标记为已处理。
$this.addClass（'dataTableProcessed'）；
//暂时隐藏按钮，直到我们找到更好的方法。
如果（！excel）{
$（'.fa-file-excel-o'）.css（'display'，'none'）；
}
//如果禁用分页，则隐藏表信息。。。
如果（！分页）{
$（'.dataTables_info'）.css（'display'，'none'）；
}
});
}

由于Datatable代码在打印时似乎会删除HTML代码，因此解决方案是通过[li]和[/li]删除HTML标记（即

）

然后：

您可以获取并创建自己的print.js文件

不显示

和

，而是显示[li]和[/li]…就像此数据表不会删除此数据一样

在print.js代码中，更改行

str+=''+dataOut+''

借

dataOut=dataOut.replace（“[li]”，“
”）

dataOut=dataOut.replace（“[/li]”，“
”）

str+=''+dataOut+''

最后，您必须在单元格中添加一个自定义渲染器，用
和
替换[li]和[/li]
就这样做了！；-）

新年快乐（法国凌晨2点；-）
 结果表明，只需关闭导出选项中的
scriptHtml
。看了一眼就明白了

现在我的导出按钮JS如下所示：

    {
     extend: 'print',
     text: '<i style="font-size:24px;color:#337ab7" class="fa fa fa-print fa-2x"></i>',
     exportOptions: 
      {
            stripHtml: false
      }
    }

{
扩展：“打印”，
文本：“”，
出口选择：
{
stripHtml:false
}
}
您的代码似乎正常。如果你能给我们一个完整的工作JSFIDLE，它将帮助我们理解可能的css冲突，例如…好的，让我准备一下it@Pierre由于某种原因，我不能在那里显示打印按钮，你能帮忙吗？缺少按钮的2个js：和css我想不，我肯定我添加了它们，这是另一个尝试明天我将尝试：）晚安！：-）嘿，我试过这个，但它似乎对我不起作用：“打印预览不会呈现它，但真正的表格页面工作正常