阻止父操作的 Javascript 弹出打印页面

标签 javascript jquery

我有一个父页面调用子弹出页面来显示打印页面。重定向到打印页面后如果我关闭子页面我可以在父页面中进行其他事件,但是当我最小化我的子页面(打印页面)并尝试一些事件时它没有响应,关闭子页面后我做了什么它正在重新创建。

代码:

var chartDiv = document.getElementById('innerchartdiv');
var outerContainerDiv = document.getElementById('outerContainer');
var divToPrint = chartDiv.innerHTML;
setTimeout(function(){
var popupWin = window.open('', '_blank', 'width=800px,height=800px');
popupWin.document.open();
popupWin.document.write('<html><body align="center" style="margin:0% 17%;font-size:9px;">' +     chart+'</html>');
popupWin.document.close();
popupWin.focus();
popupWin.print();
popupWin.close();

最佳答案

不幸的是,如果你在弹出窗口上调用打印,它就像一个警告框一样,它会阻塞线程!我以前遇到过这个问题,答案是打印对话总是阻塞 JS 线程。

这就是许多网站在新选项卡中打开生成的 PDF,而不是使用打印对话框的原因。我知道这不是您想要的答案,但这就是人们也使用自定义警告框的原因。为用户界面阻止 JS 的执行会破坏用户体验,并停止所有动画和事件触发,直到您单击为止。

备选建议:

您无法通过 JS 控制弹出窗口,它实际上必须是一个超链接。但是,有一种方法可以在没有服务器的情况下执行此操作。客户端 PDF 生成工具和“Blob URL”在现代浏览器中工作,因此您也可以进行客户端 PDF 生成。尝试 jsPDF ,我还没有用过那个,但它可能会起作用。

还有:

跨浏览器打印 css 和大小不是很统一,所以如果你想控制布局,PDF 生成是迄今为止确保页面以预期方式打印的最简单的选择。我不太喜欢 PDF 格式,但这就是它如此受欢迎的原因。

关于阻止父操作的 Javascript 弹出打印页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27249231/

相关文章:

javascript - Fabric Js 将一个图像拖动到另一个图像上

javascript - 每次成功响应后,再次请求

javascript - 推特 Bootstrap : Uncaught TypeError: Object modal1 has no method 'toggle'

javascript - 奇怪的冒泡问题

javascript - socket.io 发送给它后留出空间

javascript - 使用 AngularJS 匹配一个或多个字母数字字符

javascript - 在javascript中重命名文档变量是否安全

javascript - jQuery 高尔夫记分牌

php - 如何使用带有 Codeigniter 的 jQuery Nestable 插件创建子级菜单?

jquery - 如何使用 MVC 和 WCF 进行客户端验证而不重复逻辑?