如何从 javascript 的弹出窗口中打印? [英] How do you print from a popup window in javascript?
问题描述
我有一个 .Net 应用程序，它可以动态创建一个小的 HTML 页面，并使用 javascript document.open 方法在新窗口中弹出它.具有该功能的一切工作正常.
I have a .Net application that dynamically creates a small HTML page and pops it up in a new window using the javascript document.open method. Everything with that functionality is working fine.
现在我想在打印页面的 HTML 页面中添加一个按钮.我尝试使用以下代码无济于事:
Now I want to add a button to the HTML page that prints the page. I have tried using the following code to no avail:
<a href='print.html' onClick='window.print();return false;'>
<img src='images/printer.png' height='32px' width='32px'></a>
在弹出窗口中单击按钮时，没有任何反应.但是当这个页面的源代码作为一个单独的页面保存并加载到浏览器中时，打印按钮可以完美地工作.所以看起来问题是由代码在弹出窗口中引起的. [现在的问题似乎是打开弹出窗口后写入的代码.]有谁知道解决此问题的方法或任何替代方法?
When the button is clicked in the popup window, nothing happens. But when the source code of of this page is saved and loaded in a browser as a separate page, the print button works perfectly. So it would appear that the problem is caused by the fact that the code is in a popup window. [The problem now appears to be that the code in written to the popup window after it is opened.] Does anyone know a way to fix this problem or any alternatives?
我尝试过的其他方法，结果相同:
Other method that I have tried with the same results:
<input type='button' onclick='window.print()' value='Print' />
和
<a href='javascript:window.print()'>
<img src='images/printer.png' height='32px' width='32px'></a>
再次
以上代码在 Firefox 中有效，但在 IE7 中无效.关于 IE 的变通方法有什么想法吗?
The above code works in Firefox, but not in IE7. Any ideas on a work around for IE?
再次
这是一个使用 npup 张贴下面.我没有将弹出窗口的代码放在单独的 html 文件中，而是打开一个空白 url，然后将代码写入其中.这一步似乎是导致问题的原因.
Here is a test case using the code that npup posted below. Instead of the code for the popup window living in a separate html file, I am opening a blank url and then writing the code to it. This step appears to be what is causing the problem.
<html>
<head>
<title>main</title>
</head>
<body>
<h1>
Pop & print</h1>
<button onclick="pop();">
Pop</button>
<script type="text/javascript">
var POP;
function pop() {
var newWin = window.open('', 'thePopup', 'width=350,height=350');
newWin.document.write("<html><head><title>popup</title></head><body><h1>Pop</h1>" +
"<p>Print me</p><a href='print.html' onclick='window.print();return false;'>" +
"<img src='images/printer.png' height='32px' width='32px'></a></body></html>");
}
</script>
</body>
</html>
推荐答案
我通过使用标准 HTML 标记创建一个空白 HTML 页面解决了这个问题.然后我通过创建一个新的 DOM 元素并编辑 innerHTML 添加了内容.生成的代码与示例中的相同，只需将 newWin.document.write 命令替换为以下内容:
I have solved the problem by creating a blank HTML page with the standard HTML markup. I then added the content by creating a new DOM element and editing the innerHTML. The resulting code is the same as in the example, simply replacing the newWin.document.write command with the following:
var newDiv = newWin.document.createElement( 'div' );
newDiv.innerHTML = "<h1>Pop</h1>" +
"<p>Print me</p><a href='print.html' onclick='window.print();return false;'>" +
"<img src='images/printer.png' height='32px' width='32px'></a>"
newWin.document.body.appendChild(newDiv);
虽然问题已经解决，但老实说，我不确定问题的确切原因是什么.如果有人有任何想法，我会很高兴听到他们的意见.
While the issue has been resolved, I am honestly not sure what was the exact cause of the problem. If anyone has any ideas, I would be glad to hear them.
这篇关于如何从 javascript 的弹出窗口中打印?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
