使用 javascript 打印文档
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/28580383/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
print a document using javascript
提问by raji satkunam
Hi I need to print a document without buttons.Can anyone please guide me to accomplish this task.
嗨，我需要打印一个没有按钮的文档。任何人都可以指导我完成这项任务。
I have a button to print in button click onclick() event I have used window.print() to print those data .But In a print preview It shows the page including those 4 buttons.i do not want those buttons I need only those data.
我有一个按钮可以在按钮 click onclick() 事件中打印我已经使用 window.print() 来打印这些数据。但是在打印预览中它显示了包含这 4 个按钮的页面。我不想要那些按钮，我只需要那些数据。
for more information I have adde the image below
有关更多信息，我添加了下面的图片
回答by Bhargav Modi
1 Give your print button an ID:
1 为您的打印按钮提供一个 ID：
<input id="printpagebutton" type="button" value="Print this page" onclick="printpage()"/>`
Adjust your script the way that it hides the button before calling window.print():
<script type="text/javascript"> function printpage() { //Get the print button and put it into a variable var printButton = document.getElementById("printpagebutton"); //Set the print button visibility to 'hidden' printButton.style.visibility = 'hidden'; //Print the page content window.print() //Set the print button to 'visible' again //[Delete this line if you want it to stay hidden after printing] printButton.style.visibility = 'visible'; } </script>
在调用 window.print() 之前调整脚本隐藏按钮的方式：
<script type="text/javascript"> function printpage() { //Get the print button and put it into a variable var printButton = document.getElementById("printpagebutton"); //Set the print button visibility to 'hidden' printButton.style.visibility = 'hidden'; //Print the page content window.print() //Set the print button to 'visible' again //[Delete this line if you want it to stay hidden after printing] printButton.style.visibility = 'visible'; } </script>
回答by Programmer
Use CSS @media printor a printstylesheet to hide the button when it is printed. That way it will be hidden on the printout whether the button is used to print or not.
打印时使用 CSS@media print或print样式表隐藏按钮。这样无论按钮是否用于打印，它都会隐藏在打印输出中。
<style type="text/css">
@media print {
#printbtn {
display : none;
}
}
</style>
<input id ="printbtn" type="button" value="Print this page" onclick="window.print();" >
Refer @media print
回答by Tom
You can specify different css rules for printing. Either you can use the @media print {}scope like this:
您可以为打印指定不同的 css 规则。您可以@media print {}像这样使用范围：
@media print {
/* Add your custom css rules here */
input {
display: none;
}
}
Or you can specify an entirely different css file to use like this (if you want to change your black background and white text to something more printer friendly):
或者，您可以指定一个完全不同的 css 文件来使用（如果您想将黑色背景和白色文本更改为对打印机更友好的内容）：
<link rel="stylesheet" href="print.css" type="text/css" media="print" />
回答by Rohith Murali
To simply print a document using javascript, use the following code,
要简单地使用 javascript 打印文档，请使用以下代码，
print(){
let w=window.open("www.url.com/pdf");
w.print();
w.close();
}
回答by invinciblejai
add a wrapper to non-printable stuff i.e buttons in your case. check below code :
将包装器添加到不可打印的东西，即您的案例中的按钮。检查以下代码：
<head>
<style type="text/css">
#printable {
display: none;
}
@media print {
#non-printable {
display: none;
}
#printable {
display: block;
}
}
</style>
</head>
<body>
<div id="non-printable">
Your normal page contents
</div>
<div id="printable">
Printer version
</div>
</body>Hope it helps.
希望能帮助到你。
