简体   繁体   中英

Printing a web page using just url and without opening new window?

<html>
<head>
<script type="text/javascript">
    var URL = "http://localhost:8000/foobar/";
    var W = window.open(URL);    **Note1**
    W.window.print(); 

</script>
</head>
<p> Print ME...............</p>
</html>

I am using this script to print a webpage. My views render this page and The JS take care all other things.

But I dont want to open new window for that. So, What should I use instead of window.open(URL) so no new window opens. Similarly, I don't want to open new window for print function .So, Whenever I render this page it do all stuff on the same page. No new window, No new tab. How can I achieve this. I google but nothing seems working.

You can do this using a hidden iFrame (I'm using jquery for the example):

function loadOtherPage() {

    $("<iframe>")                             // create a new iframe element
        .hide()                               // make it invisible
        .attr("src", "/url/to/page/to/print") // point the iframe to the page you want to print
        .appendTo("body");                    // add iframe to the DOM to cause it to load the page

}

This will load the page you want to print. To print, you can add javascript code to the print page so that it gets printed after loading:

$(document).ready(function () {
    window.print();
});

This will print the page without showing a new window. I've tested this in IE8,9 and Google Chrome, so I'm not sure if this works for Safari or Firefox, though.

MDN 上有一个很好的例子,如何使用隐藏的iframe https://developer.mozilla.org/en-US/docs/Printing#Print_an_external_page_without_opening_it

In reference to @andragon's answer . updated on top of it.

You can do this using an iFrame(Not hidden because hidden iFrame prints the blank page in latest versions of browsers. You can hide after the print is triggered)

function loadOtherPage(link) {
        $("<iframe class='printpage'>") // create a new iframe element
            .attr("src", link) // point the iframe to the page link you want to print
            .appendTo("body");
    }

This will load the page link you want to print. On loading the print page link you can call javascript.

$(document).ready(function () {
        window.print();
    });

    window.onafterprint = function () {
        $('.printpage', window.parent.document).hide();
    }

This will print the page from the same window and onafterprint Event is triggered when a page has started printing, or if the print dialog box has been closed

window.parent.document is to hide the iFrame block on the parent page.

I'm using Asp .net core with razor html as view, in this case I have used window.print() to print the page then used window.onafterprint to back to the page where used want to be redirected.

You can use ViewBag to replace the "/NewSales" URL.

NOTE: window.onafterprint will be called whenever user clicks Cancel/Submit/Print button in that pop-up.

$(document).ready(function () {
    window.print();

    window.onafterprint = function () {
        window.location.href = "/NewSales";
    }
});
 function CallPrint() {
        var prtContent = document.getElementById('main');
        var WinPrint = window.open('', '', 'width=800,height=650,scrollbars=1,menuBar=1');
        var str =  prtContent.innerHTML;
        WinPrint.document.write(str);
        WinPrint.document.close();
        WinPrint.focus();
    }

Call this javascript function on Print button click."main" is the id of the div which we have to print without opening into new window.I want to notify that this will print the current page div. Try and rever in case of any issue.
Thanks,
Gourav

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM