通过 JavaScript / jQuery 打印 html
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9770042/
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 html through JavaScript / jQuery
提问by HarsH
I wish to print a document by passing custom html code.
我希望通过传递自定义 html 代码来打印文档。
The non-working code I have written :
我写的非工作代码：
function Clickheretoprint()
{
var disp_setting="toolbar=yes,location=no,directories=yes,menubar=yes,";
disp_setting+="scrollbars=yes,width=780, height=780, left=100, top=25";
var content_vlue = document.getElementById("result_tbl").innerHTML;
var docprint=window.open("","",disp_setting);
docprint.document.open();
docprint.document.write('<html><head><title>Ashley Mattresses</title>');
docprint.document.write('</head><body onLoad="self.print()"><center>');
docprint.document.write('<TABLE width="100%" cellpadding=10 align=center valign="top"><TR valign="top"><TD width = "33%" valign="top">col1</TD><TD width = "33%" valign="top">col2</TD><TD width = "33%" valign="top">col3</TD></TR></TABLE>');
docprint.document.write('</center></body></html>');
docprint.document.close();
docprint.focus();
docprint.close();
}
This is the method I called on href of an anchor tag, but the not getting the work done:
这是我调用锚标记的 href 的方法，但没有完成工作：
<a href="javascript:Clickheretoprint()">
I am a beginner to JavaScript/jQuery coding.
我是 JavaScript/jQuery 编码的初学者。
回答by Shadow Wizard is Ear For You
You are on the right track. Assuming result_tblis the ID of element you like to print as-is, first wrap the element with a <div>tag e.g.:
你在正确的轨道上。假设result_tbl是您想按原样打印的元素的 ID，首先用<div>标签包装元素，例如：
<div>
<table id="result_tbl">
.....
</table>
</div>
Then have such code:
然后有这样的代码：
var docprint=window.open("about:blank", "_blank", disp_setting);
var oTable = document.getElementById("result_tbl");
docprint.document.open();
docprint.document.write('<html><head><title>Ashley Mattresses</title>');
docprint.document.write('</head><body><center>');
docprint.document.write(oTable.parentNode.innerHTML);
docprint.document.write('</center></body></html>');
docprint.document.close();
docprint.print();
docprint.close();
Working fine for me under Chrome 18:
在 Chrome 18 下对我来说工作正常：
回答by Turgut
Checkout: http://jsfiddle.net/5Wfqr/3/
结帐：http: //jsfiddle.net/5Wfqr/3/
For me only source of trouble is:
对我来说，唯一的麻烦来源是：
var content_vlue = document.getElementById("result_tbl").innerHTML;
Do you have element with ID : "result_tbl" within your HTML?
您的 HTML 中是否有 ID 为“result_tbl”的元素？
回答by venkatprasad
This code works fine for me
这段代码对我来说很好用
<body>
<script type="text/javascript">
function printPage() {
var docprint = window.open("about:blank", "_blank"`enter code here`, "channelmode");
var oTable = document.getElementById("tbl");
docprint.document.open();
docprint.document.write('<html><head><title>your title</title>');
docprint.document.write('</head><body><center>');
docprint.document.write(oTable.innerHTML);
docprint.document.write('</center></body></html>');
docprint.document.close();
docprint.print();
docprint.close();
}
</script>
<table id="tbl">
<tr>
<td> content1 </td>
<td> content2 </td>
</tr>
</table>
<input type="button" value ="print" id="printButton" onclick="javascript:printPage()"/>
</body>
