1

我正在执行一些脚本来向页面添加一些 html 并向页面上的所有元素添加一些类。然后我通过执行以下代码来调用打印：

window.print();

现在用户将打印页面或取消。在此操作中，我需要删除该 html 代码并删除这些类。那么，在哪个事件上我可以执行代码以删除该 html 代码并删除这些类？

4

3 回答 3

2

我只是有同样的问题。首先，我必须添加一个打印库。我使用了 JQuery.PrintPage。然后我创建了第二个网页，这是使用打印按钮打印的确切内容。这样，如果用户“打印”页面，他们会得到准确的页面，如果他们使用我的“打印”按钮打印，他们会得到打印机格式的版本。

我相信这是我必须添加的所有代码。我将其添加到我的详细信息页面.onReady()

$("#print-link").button(
    {                
        icons: { primary: "ui-icon-print" }
    }
).printPage('@printlink');

预览我在这里为我们的生产站点提供的内容http://www.sc-pa.com/testsearch/parcel/details/0001020003

这种方法最好的部分是它优雅地失败了。如果由于某种原因 javascript 被禁用。打印按钮将改为打开一个新窗口，因为它是 JqueryUI 样式的超链接，用户可以使用本机浏览器打印功能。

这是链接（对于我的漂亮打印页面，它不会直接向用户公开） http://www.sc-pa.com/testsearch/parcel/PrettyPrint/0001020003

于 2013-07-09T14:48:42.210 回答
2

您可以使用@media标签提供打印特定样式。

@media print {
  body { font-size: 10pt }
}

您可以使用不想打印的样式隐藏数据。

在此处查看详细信息

于 2013-07-09T14:35:26.487 回答
-1

我真的认为你完全错误地处理了这个问题，你真的应该像其他人所说的那样使用媒体查询。但是，对于大便和咯咯笑，您可以使用以下非常糟糕的“解决方案”：

(function() {
    document.querySelector('a').addEventListener('click', function(e) {
        e.preventDefault();
        e.stopPropagation();

        window.print();

        var hideContent = function() {
            if (document.hasFocus) {
                var dataElem = document.getElementById('data');
                dataElem.parentNode.removeChild(dataElem);

                clearInterval(interval);
            }
        };

        var interval = setInterval(hideContent, 50); 
    });
}());

演示针对您的问题进行了调整，包括另一个丑陋的黑客，当班级分配太慢时

基本上它在打印对话框之后检查窗口是否具有焦点。但同样你不应该这样做。

我不知道浏览器支持，它可能（并且可能应该）炸毁你的电脑。

顺便说一句，我是否已经提到媒体查询是要走的路？因为他们是。

于 2013-07-09T14:57:52.930 回答