的Javascript打印iframe的內容只有

這是我的代碼的Javascript打印iframe的內容只有

<script> 
var body = "dddddd"  
var script = "<script>window.print();</scr'+'ipt>"; 

var newWin = $("#printf")[0].contentWindow.document; 
newWin.open(); 
newWin.close(); 

$("body",newWin).append(body+script); 

</script> 
<iframe id="printf"></iframe>

這工作，但它打印父頁面，我怎麼得到它打印就在iframe？

來源

2012-03-08 user1083382

是同一個域上的父頁面和框架頁面？ – 2012-03-08 10:49:36

是的，其實iframe是空的我正在寫內容 – user1083382 2012-03-08 10:51:28

我不會期望工作

嘗試，而不是

window.frames["printf"].focus(); 
window.frames["printf"].print();

，並使用

<iframe id="printf" name="printf"></iframe>

或者嘗試好老

var newWin = window.frames["printf"]; 
newWin.document.write('<body onload="window.print()">dddd</body>'); 
newWin.document.close();

如果jQuery的沒本事

Live Demo

來源

2012-03-08 11:09:59 mplungjan

嗨，謝謝我用你的第一個選項，它工作完美 – user1083382 2012-03-08 16:08:32

我正在使用jQuery，我發現通過Dom對象相同的方法。即'var iframe = $（'＃printf'）[0]; iframe.contentWindow.focus（）; iframe.contentWindow.print（）;'這是否在IE 9或更低版本？ – gawpertron 2013-10-25 13:38:22

截至2014年1月22日，無論您添加contentWindow還是調用window.frames [「printf」]。print（），這都不適用於Chrome。它打印整個頁面，而不僅僅是框架。 – Gullbyrd 2014-01-22 16:44:29

一個備用選項，這可能會或可能不適合，但清潔劑，如果它是：

如果你總是希望只打印網頁中的iframe中，你可以有一個單獨的「 @media print {}「樣式表，隱藏除iframe之外的所有內容。然後，您可以正常打印頁面。

來源

2012-03-08 12:11:04 Evert

document.getElementById("printf").contentWindow.print();

Same origin policy適用。

來源

2012-03-08 12:19:04

簡單的方法（在IE7 +，火狐，Chrome，Safari瀏覽器測試）會是這樣

//id is the id of the iframe 
function printFrame(id) { 
      var frm = document.getElementById(id).contentWindow; 
      frm.focus();// focus on contentWindow is needed on some ie versions 
      frm.print(); 
      return false; 
}

來源

2013-01-15 01:27:10 Kiarash

這隻適用於我的Chrome。我很確定它會起作用！ – user158017 2013-10-02 21:35:37

，我與所有在IE8上述解決方案的問題，已經發現，在IE 8測試一個體面的解決辦法+9，Chrome，Safari和Firefox。對於我的情況，我需要打印是動態生成的報告：

// create content of iframe 
var content = '<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">'+ 
'<head><link href="/css/print.css" media="all" rel="stylesheet" type="text/css"></head>'+ 
'<body>(rest of body content)'+ 
'<script type="text/javascript">function printPage() { window.focus(); window.print();return; }</script>'+ 
'</body></html>';

注意的PrintPage（）前身體JavaScript方法結束標記。

下一頁創建iframe和其附加到母體所以其contentWindow可用：

var newIframe = document.createElement('iframe'); 
newIframe.width = '0'; 
newIframe.height = '0'; 
newIframe.src = 'about:blank'; 
document.body.appendChild(newIframe);

下一頁設置內容：

newIframe.contentWindow.contents = content; 
newIframe.src = 'javascript:window["contents"]';

在這裏我們使用動態內容變量的iframe的窗口對象然後通過javascript：scheme調用它。

最後打印;專注於iframe和調用iframe中的內容在JavaScript的PrintPage（）函數：

newIframe.focus(); 
setTimeout(function() { 
    newIframe.contentWindow.printPage(); 
}, 200); 
return;

不是必需的setTimeout的，但是如果你裝載大量的內容，我發現鉻偶爾失敗，沒有它打印等等建議這一步。另一種方法是將'newIframe.contentWindow.printPage（）;'在try catch中並將setTimeout包裝的版本放在catch塊中。

希望這可以幫助別人，因爲我花了很多時間找到可以在多個瀏覽器上運行良好的解決方案。感謝SpareCycles。

編輯：

使用的setTimeout來調用的PrintPage功能使用以下代替：

newIframe.onload = function() { 
    newIframe.contentWindow.printPage(); 
}

來源

2013-10-03 09:32:14

我真的認爲這會奏效。但它不適用於我的任何瀏覽器。 :( – user158017 2014-03-28 19:20:48

它適用於我，任何方式我可以幫助嗎？張貼/消息我你的代碼，並會看看，或看看我在哪裏使用它的例子：[DIYInvestor]（http：// www。 diyinvestor.co.uk/compare/）通過比較頁面1，在結果表格上方的打印圖標上成功實施。 – 2014-04-04 13:07:48

@ user158017，請檢查我的編輯上面 - 這是否有幫助？意識到相當長的時間通過.. – 2014-10-09 11:32:40

如果您正在使用javascript document.write()然後設置iframe的內容，你必須關閉文檔newWin.document.close();否則以下代碼將不起作用，打印將打印整個頁面的內容而不是僅IFrame內容。

var frm = document.getElementById(id).contentWindow; 
frm.focus();// focus on contentWindow is needed on some ie versions 
frm.print();

來源

2014-09-15 03:58:38 Imran

你可以使用這個命令：

document.getElementById('iframeid').contentWindow.print();

此命令基本上是一樣的window.print（），但作爲窗口，我們想打印是在iframe中，我們首先需要以javascript對象的形式獲取該窗口的實例。

所以，在引用iframe的時候，我們首先通過使用它的id來獲取iframe，然後它的contentWindow返回一個窗口（DOM）對象。所以，我們可以直接在這個對象上使用window.print（）函數。

來源

2015-02-20 05:54:47 Perx

嗨，歡迎來到Stackoverflow.Please添加一些細節在您的答案或[看看這裏]（http://stackoverflow.com/help/how-to-answer） – 2015-02-20 05:57:48

雖然此代碼塊可能會回答這個問題，如果你能提供一些解釋爲什麼它會這樣做，這將是一個更好的答案。 – DavidPostill 2015-02-20 08:03:56

此時，iframe中不需要script標籤。這個工作對我來說（在Chrome，火狐，IE11和節點WebKit的0.12測試）：

<script> 
window.onload = function() { 
    var body = 'dddddd'; 
    var newWin = document.getElementById('printf').contentWindow; 
    newWin.document.write(body); 
    newWin.document.close(); //important! 
    newWin.focus(); //IE fix 
    newWin.print(); 
} 
</script> 

<iframe id="printf"></iframe>

感謝所有的答案，救我的一天。

來源

2015-04-24 00:54:56 Edakos

-1

我想知道你做iframe打印的目的是什麼。

我剛纔遇到類似的問題：使用chrome的打印預覽來生成iframe的PDF文件。

最後我解決我的問題一招：

$('#print').click(function() { 
 
    $('#noniframe').hide(); // hide other elements 
 
    window.print();   // now, only the iframe left 
 
    $('#noniframe').show(); // show other elements again. 
 
});

來源

2015-04-29 13:36:59

使用此代碼IE9及以上：

window.frames["printf"].focus(); 
window.frames["printf"].print();

對於IE8：

window.frames[0].focus(); 
window.frames[0].print();

來源

2015-07-02 07:20:55 Bhavana

的Javascript打印iframe的內容只有

回答

相關問題