我目前正在尝试在页面上打印元素的内容，并且我找到了以下资源，
http://www.808.dk/?code-javascript-print
http://www.daniweb.com/web-development/javascript-dhtml-ajax/threads/108117
http://vikku.info/codesnippets/javascript/print-div-content-print-only-the-content-of-an-html-element-and-not-the-whole-document/
他们都在做一些我已经拥有的变体，如下所示，
function printelement() {
var parentdiv = $(this).parent().parent();
var iframeEle = $(document.createElement("iframe")).attr("id", "print" + formParams.fpid).css({ width: "2250px", display: "none" }).appendTo("body");
var doc = document.getElementById("print" + formParams.fpid).contentWindow.document;
doc.open();
//get stylesheets
$("link[type='text/css']").each( function() {
doc.write("<link type='text/css' rel='stylesheet' href='" + $(this).attr("href") + "' />");
});
//writes all the contents of div to new iframe
$(parentdiv).each( function() {
doc.write($(this).html());
});
//print the iframe
var giframe = parentdiv.contents().find("iframe");
var printdiv2 = giframe.prevObject[0].id;
if(printdiv2) {
if($.browser.msie) {
var iedoc = giframe.prevObject[0].contentWindow.document;
iedoc.execCommand('print', false, null);
}
else { giframe.prevObject[0].contentWindow.print(); }
}
else {
if($.browser.msie){
doc.execCommand('print', false, null);
}
else { iframeEle[0].contentWindow.print(); }
}
}
这似乎在 FF 和 Chrome 中工作得很好(尽管 Chrome 一直告诉我我不能在一定时间内打印)。但是，在 IE 中它只是给我空白结果。我怎样才能让这段代码跨浏览器，或者以不同的方式做到这一点？
最佳答案
与其搞乱 iframe(对我来说感觉很老套)，我会执行以下操作:
- 将所有内容包装在您的
<body>中在<div id="mainContent">...</div> - 当用户选择打印时，将该特殊元素放在单独的 div 中，隐藏
#mainContent, 并打印整页 - (确保在打印时使用所有 CSS 设置隐藏背景等)
- 包含一个返回“正常” View 的链接，这会恢复页面
- (您可能也希望通过特定于打印的 CSS 隐藏“关闭打印 View ”链接)
...
if ($('#mainContent').length == 0)
$('body').children().wrapAll('<div id="mainContent" />');
var toPrint = $('#whateverToPrint');
var origParents = [toPrint.prev(), toPrint.parent()];
toPrint.appendTo('body').wrap('<div id="printWrapper"></div>');
$('<a href="#">Close Print View</a>').appendTo('#printWrapper').click(function(e)
{
e.preventDefault();
// Move the element back into place
if (origParents[0].length > 0)
toPrint.insertAfter(origParents[0])
else
toPrint.prependTo(origParents[1]);
// Remove wrapper and restore original content
$('#printWrapper').remove();
$('#mainContent').show();
});
$('#mainContent').hide();
setTimeout(function()
{
window.print();
}, 100); // wait for DOM to catch up
听起来不错，还是我在重新发明轮子？
关于javascript - 用于在页面上打印元素内容的跨浏览器解决方案是什么？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/7761232/