谷歌浏览器打印预览不会第一次加载页面

我正在尝试使用此代码打印页面

   function Popup() { var mywindow = window.open('', 'Ticket info', 'height=400,width=600'); mywindow.document.write('my div'); mywindow.document.write(' *{margin: 0; padding: 0;} body{padding: 3px; padding-left:20px;font:6px bold Arial;}'); mywindow.document.write(''); mywindow.document.write(''); mywindow.document.write(''); mywindow.document.write('
'); mywindow.document.write('$("#demo").barcode("1234567890128", "code39");'); mywindow.document.write(''); mywindow.print(); return true; }

基本上它会弹出一个窗口并显示页面的打印预览。 加载打印预览的第一次尝试将不会加载条形码,当您取消第一次打印预览时,然后右键单击页面并再次打印第二次打印预览现在将显示要打印的条形码。

第一次打印尝试

重印

第二次打印尝试

我认为问题来自这条线:

 mywindow.document.write('$("#demo").barcode("1234567890128", "code39");'); 

当我评论此行并向页面添加虚拟文本时。 它将在第一次尝试时自动显示在打印预览中。

在我尝试从css文件加载样式之前,我遇到了同样的问题。 我通过将样式直接传递到弹出窗口来解决这个问题。

我的问题是为什么会发生这种情况? 如何在首次尝试打印预览时加载条形码?

你需要在打印前加上延迟。 铬有一种天然缺陷。

代码如下: –

 function PrintDiv(data) { var mywindow = window.open(); var is_chrome = Boolean(mywindow.chrome); mywindow.document.write(data); if (is_chrome) { setTimeout(function() { // wait until all resources loaded mywindow.document.close(); // necessary for IE >= 10 mywindow.focus(); // necessary for IE >= 10 mywindow.print(); // change window to winPrint mywindow.close(); // change window to winPrint }, 250); } else { mywindow.document.close(); // necessary for IE >= 10 mywindow.focus(); // necessary for IE >= 10 mywindow.print(); mywindow.close(); } return true; } 

这对我有用(以及实现Anand观察到的IE 10+要求):

 function Popup() { var _window = window.open(''); _window.document.write(data); // required for IE >= 10 _window.document.close(); _window.focus(); _window.document.body.onload = function() { // continue to print _window.print(); _window.close(); }; return true; } 

而不是等待窗口加载并尝试过早地打印它,这只是等待整个document.body加载。

我在自动弹出窗口中移动了window.print()命令,因此它可以在打印之前首先加载jquery函数。

这是我添加的行。

 mywindow.document.write(' 

这是整个代码:

   '); mywindow.document.write('
'); mywindow.document.write(''); return true; }

实际上你可以创建一个扩展css并将你所有的css放在那里……


默认

  mywindow.document.write(''); 

然后就这样替换它

 mywindow.document.write(''); 

只需添加media =’print’即可识别它..

希望它会有所帮助……