在表单元素内打印html页面

Question

网页具有<form> ，需要将其发送到打印机进行打印。 键盘Cmd + P将打印整个页面，这不是我想要的。

我将事件连接到页脚上的按钮，但不确定如何仅将form内容发送到打印机。 任何想法如何？

$('form').get(0).innerHTML

Answer 1

使用media queries可以轻松完成此操作。 它将在IE9及更高版本，Chrome，FF等中运行。对于IE8，您可以使用polyfills。

现在，您要做的就是在打印时隐藏元素。 在css中写这样的东西

@media print {
    #element-to-hide {
        display: none;
    }
}

这将在打印时完全隐藏不需要的元素。

Answer 2

您可以从页面像块一样获取该元素，然后使用Javascript进行打印

<div class="print" onclick="PrintElem('#idFromPage')">

和Js代码来打印您需要的块：

    function PrintElem(elem) {
    Popup($("body").html(), elem);
}

function Popup(data, elem) {
    var mywindow = window.open('', 'Page to Print', 'height=600,width=800');
    mywindow.document.write('<html><head><title>Print Document</title>');
    mywindow.document.write('<style> body * { visibility: hidden;  } .mobile-view {displa:none;} body, html { background:#fff !important;}   #' + elem + ', #' + elem + ' * {visibility: visible; } </style>');
    mywindow.document.write('</head><body>');
    mywindow.document.write(data);
    mywindow.document.write('</body></html>');

    mywindow.document.close(); // necessary for IE >= 10
    mywindow.focus(); // necessary for IE >= 10

    $(mywindow).on('load', function () {
        mywindow.print();
    });

    return true;
}

在表单元素内打印html页面

问题描述

2 个解决方案

解决方案1
1 2016-08-12 12:25:22

解决方案2
0 已采纳 2016-08-12 12:31:11

在表单元素内打印html页面

问题描述

2 个解决方案

解决方案1 1 2016-08-12 12:25:22

解决方案2 0 已采纳 2016-08-12 12:31:11

解决方案1
1 2016-08-12 12:25:22

解决方案2
0 已采纳 2016-08-12 12:31:11