可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试):
问题:
I'm struggling to print the contents of a div tag without a pop up window
My code looks like this at the moment
var DocumentContainer = document.getElementById('print'); var WindowObject = window.open('', 'Completed Registration Form', 'width=750,height=650,top=50,left=50,toolbars=no,scrollbars=yes,status=no,resizable=yes'); WindowObject.document.writeln(DocumentContainer.innerHTML); WindowObject.document.close(); WindowObject.focus(); WindowObject.print(); WindowObject.close();
The below uses a popup window, is there a way to not do this using a popup window.
回答1:
There is a more efficient way - without jQuery or any other library
The idea is to replace the window with a hidden iframe, and print the contents of the iframe.
here is the code for that:
function ClickHereToPrint(){ try{ var oIframe = document.getElementById('ifrmPrint'); var oContent = document.getElementById('divToPrint').innerHTML; var oDoc = (oIframe.contentWindow || oIframe.contentDocument); if (oDoc.document) oDoc = oDoc.document; oDoc.write('<head><title>title</title>'); oDoc.write('</head><body onload="this.focus(); this.print();">'); oDoc.write(oContent + '</body>'); oDoc.close(); } catch(e){ self.print(); } }
This considers that you have an iframe in your page. if you don't, just create one using: document.createElement('iframe')
回答2:
Try this function-
function PrintDiv(divid) { var contents = document.getElementById(divid).innerHTML; var frame1 = document.createElement('iframe'); frame1.name = "frame1"; frame1.style.position = "absolute"; frame1.style.top = "-1000000px"; document.body.appendChild(frame1); var frameDoc = frame1.contentWindow ? frame1.contentWindow : frame1.contentDocument.document ? frame1.contentDocument.document : frame1.contentDocument; frameDoc.document.open(); frameDoc.document.write('<html><head><title>DIV Contents</title>'); frameDoc.document.write('</head><body>'); frameDoc.document.write(contents); frameDoc.document.write('</body></html>'); frameDoc.document.close(); setTimeout(function () { window.frames["frame1"].focus(); window.frames["frame1"].print(); document.body.removeChild(frame1); }, 500); return false; }
回答3:
回答4:
What do you mean by "this"? What "this" is is code to open a window and write into it. If you want to do "this" by not using a popup window, then there's nothing left in the question.
Are you trying to write the contents of the <div> into the current document? Then simply do so!
var DocumentContainer = document.getElementById('print'); var WindowObject = window.open('', 'Completed Registration Form', <args>); document.writeln(DocumentContainer.innerHTML);
Otherwise you need to be far more specific about what you wish to do.
Edit Oh, that kind of printing! Wow, people still do that?
$('#print').print();
in jQuery, using the technique that behowdle89 linked to.
Y'know, I imagine your users will wonder why they suddenly have a print dialog on their screen, and/or why their printer is suddenly whirring without notice. I suggest sending users to a PDF instead, which they can print on their own if they like, or save onto their hard disk if they have a bit more sense.
回答5:
all of the answers listed here use document.write which is bad practice, even to a temporary iframe.
try: https://github.com/jasonday/printThis
It lets you pull in the page styles, as well as allowing for an additional stylesheet all without document.write.
回答6:
this post has the answer
print div content from user control without opening a new window
You might be able to generate a CSS file that excludes everything except the , something in the lines of:
<link rel="stylesheet" type="text/css" media="print" href="print.css" />
And the putting something like this in print.css:
* { display: none; } #specialdiv { display: block; }
