嵌入的img并不总是出现在JavaScript创建的页面中_Javascript

嵌入的img并不总是出现在JavaScript创建的页面中

javascript

嵌入的img并不总是出现在JavaScript创建的页面中,javascript,Javascript,我需要生成一个带有嵌入式徽标的HTML页面，并使用JavaScript打印它，而不使用jQuery 这段代码有时是有效的。大多数情况下，不会打印图像，但如果关闭“打印”对话框，图像将显示在生成的文档中。编辑屏幕截图-未显示通用徽标显示的徽标我认为现在的情况是，在发送到打印之前，浏览器还没有时间解码Base64IMG var player = GetPlayer(); var textEntry1=player.GetVar("Page1"); var textEntry2=player

我需要生成一个带有嵌入式徽标的HTML页面，并使用JavaScript打印它，而不使用jQuery

这段代码有时是有效的。大多数情况下，不会打印图像，但如果关闭“打印”对话框，图像将显示在生成的文档中。编辑屏幕截图-未显示通用徽标显示的徽标

我认为现在的情况是，在发送到打印之前，浏览器还没有时间解码Base64IMG

var player = GetPlayer();
var textEntry1=player.GetVar("Page1");
var textEntry2=player.GetVar("Q2");
var textEntry3=player.GetVar("Page2");

var contents = "<html><head></head><body style='width:650px;padding:20px;'>";

// Logo as base 64 encoded. Its about a 5Kb file. Chopped for clarity
contents+="<img src='data:image/png;base64,iVBOR ... gAAAABJRU5ErkJggg=='>";

contents+="<div style='font-size:26px;font-weight:bold;margin-top:26px;margin-bottom:20px;'>Print Your Answers to PDF or Paper</div>";
contents+="<div style='display:block;border-width:1px';><hr/></div>";
contents+="<div style='font-size:16px;font-weight:bold;'>Question 1</div>";
contents+="<p>"+textEntry1+"</p>";
contents+="<div style='font-size:16px;font-weight:bold;'>"+textEntry2+"</div>";
contents+="<p>"+textEntry3+"</p>";

contents+= "</body></html>";

var myWindow = window.open("","Print","width=810,height=610,scrollbars=1,resizable=1");
myWindow.document.write(contents);
myWindow.print();

及

这两种方法都不起作用，因为打印对话框只是在没有等待的情况下出现

还尝试了myWindow.onload（），但这甚至没有打开打印对话框。

谢谢

如果您不需要等待3s，这是一种不好的做法：（不好的做法是使用setTimeout而不是3s，时间只能在您无法使用其他事件时使用，请尽量避免使用）

JS与一些信号一起工作，DOM渲染与其余执行分离：在这里你可以阅读更多关于它的信息

小结： Js首先执行完整脚本，最后执行浏览渲染。当您使用setTimeout时，js会将这些函数移出执行线程，然后生成一个调用它的事件

测试如下：

var myWindow = window.open("","Print","width=810,height=610,scrollbars=1,resizable=1");
myWindow.document.write(contents);

mywindow.document.write('<script type="text/javascript">
window.onload=function() { 
   mywindow.document.close(); // necessary for IE >= 10
   mywindow.focus(); // necessary for IE >= 10*/
   window.print(); 
   window.close(); 
};
</script>');

var myWindow=window.open（“，”打印“，”宽度=810，高度=610，滚动条=1，可调整大小=1”）；
myWindow.document.write（目录）；
mywindow.document.write（'
window.onload=function（）{
mywindow.document.close（）；//对于IE>=10是必需的
mywindow.focus（）；//IE>=10所必需的*/
window.print（）；
window.close（）；
};
');

谢谢您的回复。超时仅用于在打印前为页面提供渲染时间。3秒是任意的。我已经尝试了你另外两行代码，但大多数情况下，它仍然没有在打印上显示徽标。但是，如果我将其放入contents变量中，它就会这样做。var contents=“window.onload=function（）{window.print（）；window.close（）；}；”；所以答案被接受了，因为你给了我修复的指针。Thankswellcome，在这种情况下，请在contents+=''之前的末尾添加；对于浏览器呈现的工作方式，建议使用此选项：contents+=“…”；这可能会有所帮助：这也有助于：

myWindow.setTimeout(myWindow.print(), 3000);

window.setTimeout(myWindow.print(), 3000);
myWindow.setTimeout(myWindow.print(), 3000);

var myWindow = window.open("","Print","width=810,height=610,scrollbars=1,resizable=1");
myWindow.document.write(contents);

mywindow.document.write('<script type="text/javascript">
window.onload=function() { 
   mywindow.document.close(); // necessary for IE >= 10
   mywindow.focus(); // necessary for IE >= 10*/
   window.print(); 
   window.close(); 
};
</script>');