2014-01-09 93 views
1

有多篇文章涉及这些主题的一部分,但没有一篇将它们放在一起。将JavaScript和HTML添加到IFRAME中,并将IFRAME打印到打印机

在给定的页面上,我希望创建一个新的IFRAME,添加一些JavaScript将它打印到打印机,并添加一些HTML将打印。

以下是我在http://jsbin.com/UDUCADI/2/进行现场演示的尝试。它打印,但打印父页面,而不是IFRAME。

我该如何打印IFRAME?

<!doctype html> 
<html lang="en"> 
    <head> 
     <meta charset="utf-8" /> 
     <title>Print IFRAME</title> 
     <script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script> 
     <script type="text/javascript"> 
      $(function() { 
       $('#printIt').click(function(){ 
        var iframe = $('<iframe>'); 
        var script = document.createElement("script"); 
        script.type = "text/javascript"; 
        script.text = "window.print()"; 
        iframe[0].appendChild(script); 
        iframe.appendTo('body'); 
        var iframeDocument=$(iframe[0].contentWindow.document); 
        iframeDocument.find('body').html($('#stuffToPrint').html()); 
       }) 
      }); 
     </script> 
    </head> 
    <body> 
     <button id="printIt">Print</button> 
     <div id="stuffToPrint"> 
      <p>Print this text!</p> 
      <img alt="And print this image" src="dropdown_arrow_blue.gif"> 
     </div> 
     <div>Don't print this!</div> 
    </body> 
</html> 
+1

隐藏一切以仅打印样式表? – Blazemonger

回答

2

EDITED

实际上有几件事情是错误的。其中之一就是混合jQuery和DOM api。其次是将脚本标记添加到iframe的主体,然后再次设置主体的HTML,覆盖脚本标记。第三:你正在使用script.text,它应该是script.innerHTML。

$(function() { 
$('#printIt').click(function(){ 
    var iframe = document.createElement('iframe'); 
    document.body.appendChild(iframe) 
    iframe.contentWindow.document.body.innerHTML = $('#stuffToPrint').html(); 
    var script = document.createElement("script"); 
    script.innerHTML = "window.print()"; 
    iframe.contentWindow.document.body.appendChild(script); 
}) 
}); 

在工作版本:http://jsbin.com/UDUCADI/5/

+0

我相信这种方法在某些浏览器上很麻烦。请参阅http://stackoverflow.com/questions/472951/how-do-i-print-an-iframe-from-javascript-in-safari-chrome – user1032531

+1

你有没有尝试过这个问题的答案? – Kerstomaat

+0

尝试过多次,但都没有成功。不知道我做错了什么。可能与将JavaScript引入iframe相关。 – user1032531