我必须打印对话框的内容。我添加一个空的 iframe,然后用 javascript 添加内容。
这是我的 js 代码,我将 html 和 css 添加为 iframe 的子级
var layoutCSS = new String('<link href="css/ReportPageOne.css" rel="stylesheet" type="text/css">');
var pageOneCSS = new String('<link href="css/ReportLayout.css" rel="stylesheet" type="text/css">');
var pageTwoCSS = new String('<link href="css/ReportPageTwo.css" rel="stylesheet" type="text/css">');
var materialityCSS = new String('<link href="css/MaterialityMatrix.css" rel="stylesheet" type="text/css">');
window.frames.print_frame.document.head.innerHTML = layoutCSS + pageOneCSS + pageTwoCSS + materialityCSS;
window.frames.print_frame.document.body.innerHTML = $('#__dialog1-cont').html();
window.frames.print_frame.window.focus();
window.frames.print_frame.window.print();
正确打开打印对话框,但 css 没有很好地应用。
在选项的打印页面上,我选中了“背景图形”,并且我正在使用谷歌浏览器。
最佳答案
您在样式加载之前调用 frame.print()
。
“一旦加载并解析了样式表及其所有导入的内容,并且在样式开始应用于内容之前,就会触发 load 事件。”
试试这个:
head.lastChild.addEventListener("load", function (event) {
// In IE, you have to focus() the Iframe prior to printing
// or else the top-level page will print instead
frame.focus();
frame.print();
}, 0);
引用文献
关于javascript - 如何使用 iframe 和 css 打印网页,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39537252/