如何使用jquery打印div内容

时间:2015-07-06 11:21:11

标签: javascript jquery

我正在尝试打印我的内容,但body不包含我要插入的所有打印内容。似乎某种height问题。

var printcontent=$("#printDiv").html();
var printdiv=document.createElement('div');
$(printdiv).html(printcontent);
$('body').before(printdiv);
$('body').css('visibility', 'hidden');
window.print();
$('body').css('visibility', 'visible');

2 个答案:

答案 0 :(得分:2)

如果您想打印某些数据,我建议使用css设置媒体

@media print {
    p {
        font-family: georgia, serif;
        font-size: 14px;
        color: blue;
    }
}

这将在您打印时为您提供p内容。您可以为div元素

做同样的事情

答案 1 :(得分:0)

CSS媒体查询(打印)是正确的方法。您还可以在jQuery中执行以下操作。请记住,您最终会在身体内容周围额外div,但这可能不是问题。

var printcontent = $("#printDiv").html();
var printdiv = $('<div/>', { 'id': "print-layout"}).html(printcontent);

$('body').wrapInner("<div id='body-content'></div>");
$('#body-content').before(printdiv);
$('#body-content').css('visibility', 'hidden');

window.print();
setTimeout(function() {
    $('#print-layout').remove();
    $('#body-content').css('visibility', 'visible');
}, 0);