打印css为同一页面的两个部分

Question

我目前正在使用一些jquery通过按钮打开打印对话框：

$('.print').click(function () {
        window.print();
        return false;
    });

这使用了带有media =“print”的样式，它在打印前隐藏了一个特定的div：

#someDiv {
     display:none !important;
}

我想添加另一个按钮，只打印这个特殊的div。我有什么选择来实现这一目标？

Answer 1

您可以使用JavaScript在链接标记中交换对print css的引用。

假设您有两个带有ids print1和print2的打印按钮，以及两个名为print1.css和print2.css的样式表。然后您的链接标记如下所示：

<link id="printstyle" rel="stylesheet" href="http://0.0.0.0:3000/print1.css">

和一些Javascript / jQuery：

$("#print1").click(function(){
  $("#printstyle").attr('href', '/print1.css');
  window.print();
});

$("#print2").click(function(){
  $("#printstyle").attr('href', '/print2.css');
  window.print();
});

您可能需要确保覆盖每个样式表中定义的每种样式。