时间戳

首页 > 解决方案 > 打印窗口 - 失去对父页面的控制

javascript - 打印窗口 - 失去对父页面的控制

问题描述

所以我有一个页面，我有一个打印按钮，为此我打开一个新窗口，问题是如果我不关闭打印窗口，我将无法在父页面中执行任何操作。如果我不想在那一刻打印文件，有什么方法可以不失去对它的控制。

这是打印页面的功能：

function printTable() {
            var divToPrint = document.getElementById('grid-command-buttons');
            var title= document.getElementById('idTitle');
            var htmlToPrint = '' +
                '<style type="text/css">' +
                'table{' +
                'border-spacing:0; border-collapse: collapse;' +
                '}'+
                'table th, table td {' +
                'border:0.1em solid #000;' +
                'padding:0.5em;' +
                '}' +
                'table th>a{'+
                'text-decoration: none;'+
                'color: black;'+
                '}'+
                'table th>input{'+
                'display: none;'+
                '}'+
                'h1{'+
                'font-size: 1.1em;'+
                '}'+
                '</style>';

            htmlToPrint += title.outerHTML;
            htmlToPrint += divToPrint.outerHTML;
            newWin = window.open("");
            newWin.document.write(htmlToPrint);
            newWin.print();
            newWin.close();
        }

更新：

我想打开一个新窗口的主要原因是因为我不想保留表格的当前 css 设计。但是我用没有设计的新表格替换了正文的内容，并在当前页面上使用了打印功能。然后在关闭它后，我在页面上恢复了带有设计的表格。

function printTable(){

            var divToPrint = document.getElementById('grid-command-buttons');
            var title= document.getElementById('idTitle');
            var htmlToPrint = '' +
                '<style type="text/css">' +
                'table > tr > td:first-child{' +
                ' width: 2px; important;'+
                '}'+

                'table{' +
                'border-spacing:0; border-collapse: collapse;font-size: 9px;' +
                '}'+
                'table th, table td {' +
                'border:0.1em solid #000;font-size: 9px;' +
                'padding:0.5em;' +
                '}' +
                'table th>a{'+
                'text-decoration: none;'+
                'color: black;'+
                '}'+
                'table th>input{'+
                'display: none;'+
                '}'+
                'h1{'+
                'font-size: 1.1em;'+
                '}'+
                '</style>';

            htmlToPrint += title.outerHTML;
            htmlToPrint += '<table>';
            htmlToPrint += divToPrint.innerHTML;
            htmlToPrint += '</table>';

            var restorepage = $('body').html();


            $('body').empty().html(htmlToPrint);
            window.print();
            $('body').html(restorepage);
        }

标签： javascriptjqueryhtml

解决方案

像这样调用你的函数并删除 newWin.close()：

window.setTimeout(printTable, 0);

编辑：我假设您希望窗口保持打开状态，以便稍后打印。

推荐阅读