Javascript google chrome打印预览不会第一次加载页面_Javascript_Jquery_Google Chrome_Printing

Javascript google chrome打印预览不会第一次加载页面

javascript jquery google-chrome printing

Javascript google chrome打印预览不会第一次加载页面,javascript,jquery,google-chrome,printing,Javascript,Jquery,Google Chrome,Printing,我正在尝试使用此代码打印页面 <html> <head> <script type="text/javascript"> function Popup() { var mywindow = window.open('', 'Ticket info', 'height=400,width=600'); mywindow.document.write('<html&g

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

<html>
<head>
    <script type="text/javascript">
        function Popup() 
        {

            var mywindow = window.open('', 'Ticket info', 'height=400,width=600');
            mywindow.document.write('<html><head><title>my div</title>');
            mywindow.document.write('<style type="text/css"> *{margin: 0; padding: 0;} body{padding: 3px; padding-left:20px;font:6px bold Arial;}</style>');
            mywindow.document.write('<script src="http://code.jquery.com/jquery-latest.min.js"><'+'/script>');
            mywindow.document.write('<script src="jquery-barcode.min.js"><'+'/script>');
            mywindow.document.write('</head><body>');
            mywindow.document.write('<div id="demo"></div>');
            mywindow.document.write('<script type="text/javascript">$("#demo").barcode("1234567890128", "code39");<'+'/script>');
            mywindow.document.write('</body></html>');
            mywindow.print();
            return true;
        }
    </script>
</head>
<body>
<input type="button" value="Print Div" onclick="Popup();" />
</body>
</html>


函数Popup（）
{
var mywindow=window.open（“”，'Ticket info'，'height=400，width=600'）；
mywindow.document.write（'mydiv'）；
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（）；
返回true；
}

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

我认为问题来自这一行：

mywindow.document.write('<script type="text/javascript">$("#demo").barcode("1234567890128", "code39");<'+'/script>');

mywindow.document.write（'$（“#demo”）.barcode（“1234567890128”，“code39”）；

当我注释这一行并在页面中添加虚拟文本时。第一次尝试时，它将自动显示在打印预览中

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

我的问题是为什么会这样？如何在第一次尝试打印预览时加载条形码？

我将弹出窗口上的window.print（）命令移到了自己的位置，以便在打印之前可以首先加载jquery函数

这是我添加的一行

mywindow.document.write('<script type="text/javascript">window.print();<'+'/script>');

mywindow.document.write（'window.print（）；'）；

这是全部代码：

<html>
<head>
    <script type="text/javascript">
        function Popup() 
        {
            var mywindow = window.open('', 'Ticket info', 'height=400,width=600');
            mywindow.document.write('<html><head><title>my div</title>');
            mywindow.document.write('<style type="text/css"> *{margin: 0; padding: 0;} body{padding: 3px; padding-left:20px;font:6px bold Arial;}</style>');
            mywindow.document.write('<script src="http://code.jquery.com/jquery-latest.min.js"><'+'/script>');
            mywindow.document.write('<script src="jquery-barcode.min.js"><'+'/script>');
            mywindow.document.write('</head><body>');
            mywindow.document.write('<div id="demo"></div>');
            mywindow.document.write('<script type="text/javascript">$("#demo").barcode("1234567890128", "code39");<'+'/script>');
            mywindow.document.write('<script type="text/javascript">window.print();<'+'/script>');
            mywindow.document.write('</body></html>');
            return true;
        }
    </script>
</head>
<body>
<input type="button" value="Print Div" onclick="Popup();" />
</body>
</html>


函数Popup（）
{
var mywindow=window.open（“”，'Ticket info'，'height=400，width=600'）；
mywindow.document.write（'mydiv'）；
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（'window.print（）；'）；
mywindow.document.write（“”）；
返回true；
}

您需要在打印前设置延迟。铬有一种天然缺陷

守则如下：-

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;
}

实际上，您可以创建一个扩展css并将所有css放在其中

违约

 mywindow.document.write('<link rel="stylesheet" type="text/css" href="/css/default.css"/>');

mywindow.document.write（“”）；

那就换成这样吧

mywindow.document.write('<link rel="stylesheet" type="text/css" href="/css/default.css" media="print"/>');

mywindow.document.write（“”）；

只需添加media='print'即可识别

希望这将有助于……

这对我来说很有效（以及实现Anand遵守的IE 10+要求）：

与其等待窗口加载并试图过早打印它，不如等待整个

document.body

加载。

您救了我的命buddyThanks@HaiderAliWajihi，以示感谢。你可以喜欢我的答案，这样其他人也可以找到这个解决方案。这个解决方案比首选答案（在Chrome上测试）更适合我，后者只在第一次有效，但在以后的测试中无效。

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;
}