如何在打印前隐藏按钮并在printind过程完成后显示?

arm*_*adi 7 javascript printing

我有一个打印按钮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;   
});
Run Code Online (Sandbox Code Playgroud)

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

epa*_*llo 18

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

因此,您添加一个样式表,其中包含用于打印的介质类型

<link rel="stylesheet" type="text/css" media="print" href="print.css" />
Run Code Online (Sandbox Code Playgroud)

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

.printButtonClass{ display : none }
Run Code Online (Sandbox Code Playgroud)

而且,在没有JavaScript的情况下打印时,按钮会隐藏.

  • @armin不,请注意上面例子中的`m​​edia ="print".这意味着这些样式将仅用于页面的打印版本,当页面在屏幕上时,它们将被忽略(并且按钮将可见) (2认同)