在表单元素中打印html页面

时间:2016-08-12 12:11:53

标签: javascript

网页中包含<form>,需要将其发送到打印机进行打印。键盘 Cmd + P 将打印整页,这不是我想要的。

我将事件连接到页脚上的按钮但不确定如何仅将form内容发送到打印机。知道怎么样?

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

2 个答案:

答案 0 :(得分:1)

使用media queries可以轻松完成此操作。它适用于IE9及以上版本,Chrome,FF等。对于IE8,您可以使用polyfill。

现在你所要做的就是在打印时隐藏元素。在你的CSS中写下这样的东西

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

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

答案 1 :(得分:0)

您可以从一个块中获取该元素,并使用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;
}