jQuery Print Code: FF: Works, Chrome: Not

JavaScript
1

I’m using this code to print a printable map. In Firefox, the element will print, but in Chrome, it is a blank page. Why is Chrome not liking the code?

<script type="text/javascript">

       function PrintElem(elem)
       {
           Popup($(elem).html());
       }

       function Popup(data) 
       {
           var mywindow = window.open('', 'printableArea', 'height=400,width=600');
           mywindow.document.write('<html><head><title>my div</title>');
           /*optional stylesheet*/ //mywindow.document.write('<link rel="stylesheet" href="main.css" type="text/css" />');
           mywindow.document.write('</head><body >');
           mywindow.document.write(data);
           mywindow.document.write('</body></html>');

           mywindow.document.close(); // necessary for IE >= 10
           mywindow.focus(); // necessary for IE >= 10

           mywindow.print();
           mywindow.close();

           return true;
       }

    </script>

<div class="parent" id="printableArea">
<div id="panzoom" class="panzoom"><img class="alignnone size-full wp-image-1435" src="http://wondervalley.com/wp-content/uploads/2015/07/wvr-directions.svg" alt="" /></div>
</div>

<p style="text-align: center;"><span id="print-map" style="cursor: pointer; text-decoration: underline; color: #0000ff;"  onclick="PrintElem('#printableArea')">Print Map</span></p>
2

My guess would be the document.write()

If you change that to use createElement, appendChild etc. does it then work?

4

Okay. Finally got it working for both FF and Chrome:

<script type="text/javascript">

    function PrintElem(elem)
    {
        Popup($(elem).html());
    }

function Popup(data) 
{
    var mywindow = window.open('', 'my div', 'height=400,width=600');
    mywindow.document.write('<html><head><title>PressReleases</title>');
    mywindow.document.write('<link rel="stylesheet" href="css/main.css" type="text/css" />');
    mywindow.document.write('</head><body >');
    mywindow.document.write(data);
    mywindow.document.write('data');
    mywindow.document.write('</body></html>');
    mywindow.document.close(); // necessary for IE >= 10

    myDelay = setInterval(checkReadyState, 10);

    function checkReadyState() {
        if (mywindow.document.readyState == "complete") {
            clearInterval(myDelay);
            mywindow.focus(); // necessary for IE >= 10

            mywindow.print();
            mywindow.close();
        }
    }

    return true;

}

</script>
1 Like
5

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.