Print a div in Chrome and Safari

Question

jQuery

 $(function(){
    $("#btnPrint").click(function(){
      var mydiv = document.getElementById("printDiv");
    printDiv(mydiv);
    });

    });

    function printDiv(divP) {

                window.frames["print_frame"].document.body.innerHTML = $(divP).html();
                window.frames["print_frame"].window.focus();
                window.frames["print_frame"].window.print();

            }

HTML

 <iframe name="print_frame" width="0" height="0" frameborder="0" src="about:blank">
        </iframe>

<div id="printDiv">
//some content here
</div>

<input type="button" id="btnPrint" value="Print"/>

The above code is working in IE and Mozilla but not working in Safari,chome and Opera? Please help..

It works fine for me (chrome 31.0.1650.63) maybe you have some other JS error on page? — Arthur Halma, Dec 12 '13 at 09:56
"Not working" means what exactly? What does it do and what is it supposed to do? Are there errors in the [JavaScript error console](http://www.netmagazine.com/tutorials/javascript-debugging-beginners)? — JJJ, Dec 12 '13 at 09:58
Check your chrome version. Its working fine for mi. Chrome version 31.0.1650.63 — Suhas Gosavi, Dec 12 '13 at 10:02
heres a better way to print a single div http://stackoverflow.com/questions/468881/print-div-id-printarea-div-only — actual_kangaroo, Dec 12 '13 at 10:06

score 6 · Answer 1 · edited May 23 '17 at 12:01

6

It looks like the purpose of this demo is to print only a single div, is that correct?

If so, it is easiest to use media queries for a cross browser solution

http://jsfiddle.net/Nu5SX/2/

@media print {
    body * {
       visibility: hidden;
    }
    #printDiv, #printDiv * {
       visibility: visible;
    }
    #printDiv {
       position: absolute;
       left: 0;
       top: 0;
    }
}

simple javascript

    window.print();

EDIT: sorry for talking like clippy :)

edited May 23 '17 at 12:01

Community

1
1

answered Dec 12 '13 at 10:09

actual_kangaroo

5,971
2
31
45

Thanks but I want to hide the printDiv by default. just checkout: http://jsfiddle.net/Nu5SX/3/ – Billy Dec 12 '13 at 11:12
1

I used a modified version to print a specific part of page online. Thanks for your inspiration! – Tim Oct 22 '14 at 09:48

Print a div in Chrome and Safari

1 Answers1