javascript 尝试打印 html 文档时无法读取 null 的属性“文档”
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/47052785/
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
Cannot read property 'document' of null when try to print html document
提问by vaishuani
I am using angualr 2.
我正在使用angualr 2。
I am trying to print html div.
我正在尝试打印 html div。
here is my code
这是我的代码
<div id="print-section">
// Html code
</div>
<button (click)="open()">print</button>
print(): void {
let printContents, popupWin;
printContents = document.getElementById('print-section').innerHTML;
popupWin = window.open('', '_blank', 'top=0,left=0,height=100%,width=auto');
popupWin.document.open();
popupWin.document.write(`
<html>
<head>
<title>Print tab</title>
</head>
<body onload="window.print();window.close()">${printContents}</body>
</html>`
);
popupWin.document.close();
}
here is my open()
这是我的 open()
open(){
//I called Api using service
let scope=this;
setTimeout(function() { scope.print(); }, 3000);
}
But i am getting this err
但我犯了这个错误
ERROR TypeError: Cannot read property 'document' of null.
错误类型错误：无法读取 null 的属性“文档”。
How can i fix this issue ?
我该如何解决这个问题？
回答by Mohsin Muzawar
It is blocked by the browser. window.open is only not being blocked, when it is invoked by user action, for example in a click event, emitted by a native browser event.
它被浏览器阻止。window.open 只有在被用户操作调用时才不会被阻止，例如在本地浏览器事件发出的点击事件中。
回答by David Votrubec
From MDN
来自 MDN
A Window object representing to the newly created window. If the window couldn't be opened, the returned value is instead null. The returned Window reference can be used to access properties and methods of the new window as long as it complies with Same-origin policy security requirements.
代表新创建的窗口的 Window 对象。如果无法打开窗口，则返回值为 null。返回的 Window 引用可用于访问新窗口的属性和方法，只要它符合同源策略安全要求。
If it returned null, it means that the popup window has been blocked by the browser. Perhaps the action has not been initialized by user?
如果返回null，则表示弹出窗口已被浏览器屏蔽。也许该操作尚未被用户初始化？
回答by LkPark
The simple solution for your fix will be to rename open()function to something else and this will fix your error message.
您修复的简单解决方案是将open()函数重命名为其他名称，这将修复您的错误消息。
Copy/Paste in your chrome inspector console.
在您的 chrome 检查器控制台中复制/粘贴。
function print() {
let popupWin = window.open('', '_blank', 'top=0,left=0,height=100%,width=auto');
popupWin.document.open();
popupWin.document.write(`
<html>
<head>
<title>Print tab</title>
</head>
<body onload="window.print();window.close()">test</body>
</html>`
);
popupWin.document.close();
}
function openOther(){
//I called Api using service
let scope=this;
setTimeout(function() { scope.print(); }, 3000);
}
openOther()
In your case the thisis the Window object, using the openname you override the native Window.open function.
在您的情况下，这是 Window 对象，使用您覆盖本机 Window.open 函数的打开名称。
