javascript - 如何在打印前隐藏按钮并在打印过程完成后显示它？

Question

我有一个带有 id="print_req" 的打印按钮。我写了一些用于打印页面的 Javascript 代码，通过单击此按钮触发，我也想在打印前隐藏此按钮，并在整个打印过程后显示它。我的意思是不要在我的打印文档中打印按钮。这是我的代码:

$(document).ready(function(){
    $("#print_req").click(function(){
        $("#print_req").css("display","none");
        window.print();  
    });

    $("#print_req").css("display","block");
    return false;   
});

这正确地隐藏了该按钮，但是当打印过程完成时，该按钮将不会再次显示!有什么问题？

Answer 1

你错了。您不应该使用 JavaScript 或使用背景图像来显示和隐藏按钮。您应该使用打印样式表，它允许您在打印页面时应用不同的样式。在您的情况下，您可以在此样式表中将显示设置为无 [或将可见性设置为隐藏]。

所以你添加一个带有打印媒体类型的样式表

<link rel="stylesheet" type="text/css" media="print" href="print.css" />

在那个 print.css 中，你隐藏了按钮

.printButtonClass{ display : none }

很快，当您不使用 JavaScript 进行打印时，按钮会隐藏。