簡體   English   中英

打印對話框關閉后自動關閉窗口

[英]Close window automatically after printing dialog closes

當用戶單擊按鈕時,我打開了一個選項卡。 onload時,我打開了打印對話框,但用戶問我是否有可能在它發送到打印機進行打印之后,如果選項卡可以自行關閉。 我不確定這是否可以做到。 我試過使用setTimeout(); ,但這不是一個定義的時間段,因為用戶可能會分心並不得不重新打開選項卡。 有沒有辦法做到這一點?

如果您嘗試在 print() 調用后立即關閉窗口,它可能會立即關閉窗口並且 print() 將不起作用。 這是你不應該做的

window.open();
...
window.print();
window.close();

此解決方案將在 Firefox 中運行,因為在 print() 調用時,它會等到打印完成,然后繼續處理 javascript 並關閉窗口。 IE 將因此失敗,因為它調用 close() 函數而不等待 print() 調用完成。 打印完成前彈出窗口將關閉。

解決它的一種方法是使用“onafterprint”事件,但我不向您推薦它,因為這些事件僅適用於 IE。

最好的方法是在打印對話框關閉(打印完成或取消)后關閉彈出窗口。 此時,彈出窗口將被聚焦,您可以使用“onfocus”事件關閉彈出窗口。

為此,只需在彈出窗口中插入此 javascript 嵌入代碼:

<script type="text/javascript">
window.print();
window.onfocus=function(){ window.close();}
</script>

希望這有幫助 ;-)

更新:

對於新的 chrome 瀏覽器,它可能仍然過早關閉, 請參見此處 我已經實現了這個改變,它適用於所有當前的瀏覽器:2/29/16

        setTimeout(function () { window.print(); }, 500);
        window.onfocus = function () { setTimeout(function () { window.close(); }, 500); }

這是我想出來的,我不知道為什么在關閉之前會有一點延遲。

 window.print();
 setTimeout(window.close, 0);

當然,這樣做很容易解決這個問題:

      <script type="text/javascript">
         window.onafterprint = window.close;
         window.print();
      </script>

或者,如果您想做一些事情,例如轉到上一頁。

    <script type="text/javascript">
        window.print();
        window.onafterprint = back;

        function back() {
            window.history.back();
        }
    </script>

只是:

window.print();
window.close();

有用。

我只想寫下我所做的以及對我有用的(因為我嘗試過的其他任何方法都沒有奏效)。

我遇到的問題是 IE 會在打印對話框出現之前關閉窗口。

經過大量的反復試驗和錯誤測試,這就是我要做的工作:

var w = window.open();
w.document.write($('#data').html()); //only part of the page to print, using jquery
w.document.close(); //this seems to be the thing doing the trick
w.focus();
w.print();
w.close();

這似乎適用於所有瀏覽器。

這段代碼非常適合我:

<body onload="window.print()" onfocus="window.close()">

當頁面打開時,它會自動打開打印對話框,打印或取消后它會關閉窗口。

希望能幫助到你,

只需通過 onafterprint 事件處理程序包裝window.close ,它對我有用

printWindow.print();
printWindow.onafterprint = () => printWindow.close();

這是 2016/05已經在 Chrome、Firefox、Opera 上測試過的跨瀏覽器解決方案。

請記住, Microsoft Edge 有一個錯誤,如果取消打印,該錯誤不會關閉窗口。 相關鏈接

var url = 'http://...';
var printWindow = window.open(url, '_blank');
printWindow.onload = function() {
    var isIE = /(MSIE|Trident\/|Edge\/)/i.test(navigator.userAgent);
    if (isIE) {

        printWindow.print();
        setTimeout(function () { printWindow.close(); }, 100);

    } else {

        setTimeout(function () {
            printWindow.print();
            var ival = setInterval(function() {
                printWindow.close();
                clearInterval(ival);
            }, 200);
        }, 500);
    }
}

使用 Chrome 我嘗試了一段時間來獲取window.onfocus=function() { window.close(); } window.onfocus=function() { window.close(); }<body ... onfocus="window.close()">工作。 我的結果:

  1. 我已經關閉了打印對話,什么也沒發生。
  2. 我在瀏覽器中更改了窗口/選項卡,仍然沒有。
  3. 改回我的第一個窗口/選項卡,然后 window.onfocus 事件觸發關閉窗口。

我還嘗試了<body onload="window.print(); window.close()" >這導致窗口在我什至可以單擊打印對話框中的任何內容之前關閉。

我不能使用其中任何一個。 所以我使用了一個小 Jquery 來監控文檔狀態,這段代碼對我有用。

<script type="text/javascript">
    var document_focus = false; // var we use to monitor document focused status.
    // Now our event handlers.
    $(document).focus(function() { document_focus = true; });
    $(document).ready(function() { window.print(); });
    setInterval(function() { if (document_focus === true) { window.close(); }  }, 500);
</script>

只需確保您已包含 jquery,然后將其復制/粘貼到您正在打印的 html 中。 如果用戶已打印、保存為 PDF 或取消打印作業,窗口/選項卡將自動自毀。 注意:我只在 chrome 中測試過這個。

編輯

正如 Jypsy 在評論中指出的那樣,不需要文檔焦點狀態。 您可以簡單地使用 noamtcohen 的答案,我將代碼更改為它並且它可以工作。

這在 Chrome 59 中運行良好:

window.print();
window.onmousemove = function() {
  window.close();
}

這對我有用 11/2020 <body onafterprint="window.close()"> ... 很簡單。

這個對我有用:

<script>window.onload= function () { window.print();window.close();   }  </script>

以下對我有用:

function print_link(link) {
    var mywindow = window.open(link, 'title', 'height=500,width=500');   
    mywindow.onload = function() { mywindow.print(); mywindow.close(); }
}

我嘗試了很多沒有用的東西。 唯一對我有用的是:

window.print();
window.onafterprint = function () {
    window.close();
}

在鉻上測試。

以下解決方案適用於 2014 年 3 月 10 日起的 IE9、IE8、Chrome 和 FF 較新版本。 場景是這樣的:您在一個窗口 (A) 中,單擊按鈕/鏈接以啟動打印過程,然后打開一個包含要打印內容的新窗口 (B),立即顯示打印對話框,您可以取消或打印,然后新窗口 (B) 會自動關閉。

以下代碼允許這樣做。 此 javascript 代碼將放置在窗口 A(而不是窗口 B)的 html 中:

/**
 * Opens a new window for the given URL, to print its contents. Then closes the window.
 */
function openPrintWindow(url, name, specs) {
  var printWindow = window.open(url, name, specs);
    var printAndClose = function() {
        if (printWindow.document.readyState == 'complete') {
            clearInterval(sched);
            printWindow.print();
            printWindow.close();
        }
    }
    var sched = setInterval(printAndClose, 200);
};

啟動進程的按鈕/鏈接只需調用此函數,如下所示:

openPrintWindow('http://www.google.com', 'windowTitle', 'width=820,height=600');
<!doctype html>
<html>
<script>
 window.print();
 </script>
<?php   
date_default_timezone_set('Asia/Kolkata');
include 'db.php'; 
$tot=0; 
$id=$_GET['id'];
    $sqlinv="SELECT * FROM `sellform` WHERE `id`='$id' ";
    $resinv=mysqli_query($conn,$sqlinv);
    $rowinv=mysqli_fetch_array($resinv);
?>
        <table width="100%">
           <tr>
                <td style='text-align:center;font-sie:1px'>Veg/NonVeg</td>  
            </tr>
            <tr>
                <th style='text-align:center;font-sie:4px'><b>HARYALI<b></th>  
            </tr>   
            <tr>
                <td style='text-align:center;font-sie:1px'>Ac/NonAC</td>  
            </tr>
            <tr>
                <td style='text-align:center;font-sie:1px'>B S Yedurappa Marg,Near Junne Belgaon Naka,P B Road,Belgaum - 590003</td>  
            </tr>
        </table>
        <br>    
        <table width="100%">
           <tr>
                <td style='text-align:center;font-sie:1'>-----------------------------------------------</td>  
            </tr>
        </table>

        <table  width="100%" cellspacing='6' cellpadding='0'>

            <tr>
                <th style='text-align:center;font-sie:1px'>ITEM</th>
                <th style='text-align:center;font-sie:1px'>QTY</th>
                <th style='text-align:center;font-sie:1px'>RATE</th>
                <th style='text-align:center;font-sie:1px'>PRICE</th>
                <th style='text-align:center;font-sie:1px' >TOTAL</th>
            </tr>

            <?php
            $sqlitems="SELECT * FROM `sellitems` WHERE `invoice`='$rowinv[0]'";
            $resitems=mysqli_query($conn,$sqlitems);
            while($rowitems=mysqli_fetch_array($resitems)){
            $sqlitems1="SELECT iname FROM `itemmaster` where icode='$rowitems[2]'";
            $resitems1=mysqli_query($conn,$sqlitems1);
            $rowitems1=mysqli_fetch_array($resitems1);
            echo "<tr>
                <td style='text-align:center;font-sie:3px'  >$rowitems1[0]</td>
                <td style='text-align:center;font-sie:3px' >$rowitems[5]</td>
                <td style='text-align:center;font-sie:3px' >".number_format($rowitems[4],2)."</td>
                <td style='text-align:center;font-sie:3px' >".number_format($rowitems[6],2)."</td>
                <td style='text-align:center;font-sie:3px' >".number_format($rowitems[7],2)."</td>
              </tr>";
                $tot=$tot+$rowitems[7];
            }

            echo "<tr>
                <th style='text-align:right;font-sie:1px' colspan='4'>GRAND TOTAL</th>
                <th style='text-align:center;font-sie:1px' >".number_format($tot,2)."</th>
                </tr>";
            ?>
        </table>
     <table width="100%">
           <tr>
                <td style='text-align:center;font-sie:1px'>-----------------------------------------------</td>  
            </tr>
        </table>
        <br>
        <table width="100%">
            <tr>
                <th style='text-align:center;font-sie:1px'>Thank you Visit Again</th>  
            </tr>
        </table>
<script>
window.close();
</script>
</html>

使用 php 和 javascript 打印並關閉新標簽窗口,單擊按鈕

這對我來說非常適合@holger,但是,我已經對其進行了修改並且更適合我,現在窗口會立即彈出並在您點擊打印或取消按鈕時關閉。

function printcontent()
{ 
var disp_setting="toolbar=yes,location=no,directories=yes,menubar=yes,"; 
disp_setting+="scrollbars=yes,width=300, height=350, left=50, top=25"; 
var content_vlue = document.getElementById("content").innerHTML; 
var w = window.open("","", disp_setting);
w.document.write(content_vlue); //only part of the page to print, using jquery
w.document.close(); //this seems to be the thing doing the trick
w.focus();
w.print();
w.close();
}"

jQuery:

$(document).ready(function(){ 
  window.print();
  setTimeout(function(){ 
             window.close();
  }, 3000);
});

這最適合我將 HTML 注入到彈出窗口中,例如<body onload="window.print()"...以上適用於 IE、Chrome 和 FF(在 Mac 上),但在 Windows 上沒有 FF。

https://stackoverflow.com/a/11782214/1322092

var html = '<html><head><title></title>'+
               '<link rel="stylesheet" href="css/mycss.css" type="text/css" />'+
               '</head><body onload="window.focus(); window.print(); window.close()">'+
               data+
               '</body></html>';

這就是我所做的......

啟用窗口以根據查詢參數打印和關閉自身。

需要 jQuery。 可以在 _Layout 或母版頁中完成以處理所有頁面。

這個想法是在 URL 中傳遞一個參數來告訴頁面打印和關閉,如果設置了參數,那么 jQuery “就緒”事件會打印窗口,然后當頁面完全加載(打印后)時“onload”被稱為關閉窗口。 所有這些看似額外的步驟都是在關閉之前等待窗口打印。

在調用 printAndCloseOnLoad() 的 html 正文中添加和 onload 事件。 在這個例子中我們使用 cshtm,你也可以使用 javascript 來獲取參數。

<body onload="sccPrintAndCloseOnLoad('@Request.QueryString["PrintAndClose"]');">

在javascript中添加函數。

function printAndCloseOnLoad(printAndClose) {
    if (printAndClose) {
        // close self without prompting
        window.open('', '_self', ''); window.close();
    }
}

和 jQuery 就緒事件。

$(document).ready(function () {
    if (window.location.search.indexOf("PrintAndClose=") > 0)
        print();
});

現在,當打開任何 URL 時,只需附加查詢字符串參數“PrintAndClose=true”,它就會打印並關閉。

對我來說,我的最終解決方案是幾個答案的混合:

    var newWindow = window.open();
    newWindow.document.open();
    newWindow.document.write('<html><link rel="stylesheet" href="css/normalize-3.0.2.css" type="text/css" />'
            + '<link rel="stylesheet" href="css/default.css" type="text/css" />'
            + '<link rel="stylesheet" media="print" href="css/print.css" type="text/css" />');

    newWindow.document.write('<body onload="window.print();" onfocus="window.setTimeout(function() { window.close(); }, 100);">');
    newWindow.document.write(document.getElementById(<ID>).innerHTML);
    newWindow.document.write('</body></html>');
    newWindow.document.close();
    newWindow.focus();

這對我有用(2018/02)。 我需要一個單獨的請求,因為我的打印還沒有出現在屏幕上。 基於上面的一些優秀回復,我感謝大家,我注意到:

  • w.onload不能w.document.write(data)之前設置。
    這似乎很奇怪,因為您想事先設置鈎子。 我的猜測:當打開沒有內容的窗口時,鈎子已經被觸發了。 既然開火了,就不會再開火了。 但是,當仍在處理新的document.write()時,將在處理完成時調用鈎子。
  • w.document.close()仍然是必需的。 否則什么都不會發生。

我已經在 Chrome 64.0、IE11 (11.248)、Edge 41.16299 (edgeHTML 16.16299)、FF 58.0.1 中對此進行了測試。 他們會抱怨彈出窗口,但它會打印出來。

function on_request_print() {
  $.get('/some/page.html')
    .done(function(data) {
      console.log('data ready ' + data.length);
      var w = window.open();
      w.document.write(data);
      w.onload = function() {
        console.log('on.load fired')
        w.focus();
        w.print();
        w.close();
      }
      console.log('written data')
      //this seems to be the thing doing the trick
      w.document.close();
      console.log('document closed')
    })
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
</script>
<a onclick="on_request_print();">Print rapportage</a>
const printHtml = async (html) => {
    const printable = window.open('', '_blank', 'fullscreen=no');
    printable.document.open();
    printable.document.write(`<html><body onload="window.print()">${html}</body></html>`);
    await printable.print();
    printable.close();
};

這是我的 ES2016 解決方案。

讓這樣的東西跨瀏覽器工作有很多痛苦。

我最初想做同樣的事情——打開一個打印樣式的新頁面,使用 JS 打印它,然后再次關閉它。 這是一場噩夢。

最后,我選擇簡單地點擊進入可打印頁面,然后使用下面的 JS 啟動打印,然后在完成后將自己重定向到我想去的地方(在本例中使用 PHP 中設置的變量)。

我已經在 OSX 和 Windows 上的 Chrome 和 Firefox 以及 IE11-8 上對此進行了測試,它適用於所有設備(盡管如果您實際上沒有安裝打印機,IE8 會凍結一段時間)。

快樂狩獵(印刷)。

<script type="text/javascript">

   window.print(); //this triggers the print

   setTimeout("closePrintView()", 3000); //delay required for IE to realise what's going on

   window.onafterprint = closePrintView(); //this is the thing that makes it work i

   function closePrintView() { //this function simply runs something you want it to do

      document.location.href = "'.$referralurl.'"; //in this instance, I'm doing a re-direct

   }

</script>

只需使用這個 java 腳本

 function PrintDiv() {
    var divContents = document.getElementById("ReportDiv").innerHTML;
    var printWindow = window.open('', '', 'height=200,width=400');
    printWindow.document.write('</head><body >');
    printWindow.document.write(divContents);
    printWindow.document.write('</body></html>');
    printWindow.document.close();
    printWindow.print();
    printWindow.close();
}

提交或取消按鈕單擊后它將關閉窗口

在 IE11 上,onfocus 事件被調用兩次,因此兩次提示用戶關閉窗口。 這可以通過輕微的改變來防止:

<script type="text/javascript">
  var isClosed = false;
  window.print();
  window.onfocus = function() {
    if(isClosed) { // Work around IE11 calling window.close twice
      return;
    }
    window.close();
    isClosed = true;
  }
</script>

這在 FF 36、Chrome 41 和 IE 11 中對我有用。即使您取消打印,即使您使用右上角的“X”關閉了打印對話框。

var newWindow=window.open(); 
newWindow.document.open();
newWindow.document.write('<HTML><BODY>Hi!</BODY></HTML>'); //add your content
newWindow.document.close();
newWindow.print();      

newWindow.onload = function(e){ newWindow.close(); }; //works in IE & FF but not chrome 

//adding script to new document below makes it work in chrome 
//but alone it sometimes failed in FF
//using both methods together works in all 3 browsers
var script   = newWindow.document.createElement("script");
script.type  = "text/javascript";
script.text  = "window.close();";
newWindow.document.body.appendChild(script);
setTimeout(function () { window.print(); }, 500);
        window.onfocus = function () { setTimeout(function () { window.close(); }, 500); }

這對我來說很完美。 希望能幫助到你

這適用於我在 Chrome 上(尚未在其他人身上嘗試過)

$(function(){
    window.print();
    $("body").hover(function(){
        window.close();
    });
});

我試過了,它有效

var popupWin = window.open('', 'PrintWindow', 
'width=650,height=650,location=no,left=200px');
popupWin.document.write(data[0].xmldata);
popupWin.print();
popupWin.close();

我想最好的方法是等待文檔(又名 DOM)正確加載,然后使用打印和關閉功能。 我將它包裝在 Document Ready 函數 (jQuery) 中:

<script>
$(document).ready(function () {
window.print();
window.close();
});
</script>

值得注意的是,上面的內容放在我的“可打印頁面”上(您可以將其稱為“printable.html” ,我從另一個頁面鏈接到它(如果您願意,可以將其稱為 linkpage.html ):

<script>
function openNewPrintWindow(){
var newWindow=window.open('http://printable.html'); //replace with your url
newWindow.focus(); //Sets focus window
}
</script>

對於只是在尋找解決方案的復制粘貼開發人員,這里是上述功能的“觸發器”(同一頁面):

<button onclick="openNewPrintWindow()">Print</button>

所以會

  1. 單擊打印時打開一個新窗口
  2. 頁面加載后觸發(瀏覽器)打印對話框
  3. 打印(或取消)后關閉窗口。

希望你玩得開心!

簡單添加:

<html>
<body onload="print(); close();">
</body>
</html>

嘗試這個:

var xxx = window.open("","Printing...");
xxx.onload = function () {
     setTimeout(function(){xxx.print();}, 500);
     xxx.onfocus = function () {
        xxx.close();
     }  
}

僅使用原生事物的完全不同的方法

首先,在要打印的頁面中添加以下內容

<head>
<title>printing please wait</title>
<META http-equiv=Refresh content=2;url="close.html">
</head>
<body onLoad="window.print()">

然后使用以下內容制作 close.html

<body onLoad="window.close()"></body>

現在,當顯示打印對話框時,頁面將保持打開狀態。 打印或取消任務完成后,頁面將輕而易舉地關閉。

<!--- ON click print button, get print and on click close button of print window, get print window closed--->

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Print preview</title>

 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
    $(function () {
        $("#testid").click(function () {
            var sWinHTML = document.getElementById('content_print').innerHTML;
            var winprint = window.open("", "");
            winprint.document.open();
            winprint.document.write('<html><head>');
            winprint.document.write('<title>Print</title>');
            winprint.document.write('</head><body onload="window.focus(); window.print(); window.close()">');
            winprint.document.write(sWinHTML);
            winprint.document.write('</body></html>');
            winprint.document.close();
            winprint.focus();
        })
    })
</script>
</head>
 <body>

  <form id="form-print">
    <div id="content_print">
    <h3>Hello world</h3>
    <table cellpadding="0" cellspacing="0" width="100%">
    <thead>
    <tr>
    <th style="text-align:left">S.N</th>
    <th style="text-align:left">Name</th>
    </tr>
    </thead>
    <tbody>
    <tr>
      <td>1</td>
      <td>Bijen</td>
    </tr>
    <tr>
      <td>2</td>
      <td>BJ</td>
    </tr>
    </tbody>
    </table>
    </div>
    <button type="button" id="testid"/>Print</button>
</form>
</body>
</html>
document.addEventListener('DOMContentLoaded', (e)=>{
        print();
    if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {//expresion regular evalua navegador
        window.onfocus = function(){window.close();}
    } else {
        window.onafterprint = function(e){
        window.close();
        }
    }
});

onafterprint 在桌面瀏覽器上對我很有用,在智能手機上不行,所以你做這樣的事情並工作,有很多解決方案,所以無論如何都要嘗試很多。

IE 有(有?) onbeforeprintonafterprint事件:你可以等待,但它只能在 IE 上工作(可能會也可能不會)。

或者,您可以嘗試等待焦點從打印對話框返回到窗口並關閉它。 Amazon Web Services 在他們的發票打印對話框中執行此操作:您點擊打印按鈕,它會打開打印友好的視圖並立即打開打印機對話框。 如果您點擊打印或取消打印對話框關閉,然后打印友好視圖立即關閉。

我想出了這個簡單的腳本:

<script type="text/javascript">
setTimeout(function () { window.print(); }, 500);
setTimeout(function () { window.close(); }, 1000);
</script>

打印后關閉彈出窗口。

在父窗口中

  let IframeLink = '../Sale/PriceKOT?SalesID=@(Model.SalesInfo.SalesID)&PrintTypeID=3';
     var newwindow = window.open(IframeLink, "KOT Print", 'width=560,height=550,toolbar=0,menubar=0,location=0');
    if (window.focus) { newwindow.focus() }

    function closeThisPopUp() {            
        newwindow.close();
        printf();
    } 

在子窗口或彈出窗口中

 window.onafterprint = function (event) {
    opener.closeThisPopUp();
    window.close;
};

REF 源參考

<script type="text/javascript">
  window.print();
  window.onafterprint = window.close;   
</script>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM