0

在打印具有固定标题的表格时，我需要保留默认的引导 css，但需要覆盖一些与溢出相关的样式，因为表格可以垂直滚动。

基本上我希望留下 targetStyles: ['*'] 以匹配我的引导 css 模板中的内容，但需要覆盖 tbody {overflow:auto} 和另一种自定义样式的 .table-responsive {overflow-x:auto} 。如何保留所有引导 css 但更改这两种样式以进行打印作业？

我尝试过使用 targetStyles: 和 style: 这两种样式的列表。https://printjs.crabbly.com/#documentation对这种情况很有帮助，但还不够直观

/* my table is contained in a div with id of #howDoingTable */
printJS({
   printable: 'howDoingTable',
   type: 'html',
   targetStyles: ['*'],
   style: '#howDoingTable tbody {overflow:none;} #howDoingTable.table-responsive {overflow-x:none;}'              
});
/*It's ignoring the style with the two overrides I want to implement via style:*/
4

1 回答 1

0

除非当前提供的 printJS 无法做到这一点，否则我发现解决方法是在调用 printJS 之前更改需要更改的样式，然后通过 jQuery 重新启用它们：

      //change overflow css to visible to remove scrolling in the ui
      $("#howDoingTable.table-responsive").css("overflow-x","visible");
      $("#howDoingTable tbody").css("overflow","visible");
      printJS({
          printable: 'howDoingTable',
          type: 'html',
          targetStyles: ['*']            
      });
      //change the overflow css properties back to scrolling
      $("#howDoingTable.table-responsive").css("overflow-x","auto");
      $("#howDoingTable tbody").css("overflow","auto");
于 2019-07-23T20:50:14.137 回答