如何使用樣式表打印iFrame？

我創建了這個代碼從一個iFrame如何使用樣式表打印iFrame？

function (data) { 
    var frame = $("<iframe>", { 
     name: "iFrame", 
     class: "printFrame" 
    }); 

    frame.appendTo("body"); 

    var head = $("<head></head>"); 

    _.each($("head link[rel=stylesheet]"), function (link) { 
     var csslink = $("<link/>", { rel: "stylesheet", href: $(link).prop("href") }) 
     head.append(csslink); 
    ;}); 

    frame.contents().find("head") 
     .replaceWith(head); 

    frame.contents().find("body") 
     .append(this.html()); 

    window.frames["iFrame"].focus(); 
    window.frames["iFrame"].print(); 
}

這將創建一個iFrame打印數據，增加了一個頭，在那裏設置所需要本網站所有的CSS鏈接。然後它創建身體。

問題是，造型不會適用於打印，除非我在第行break.contents（）。find（「head」）。replaceWith（head），這意味着該部分正在異步運行。

問題是，我可以以某種方式獲得代碼在運行該行之前等待一段時間，或者可能有另一種方法來執行此操作？不幸的是，我並不熟悉iFrames，所以我不知道它在嘗試做什麼。

來源

2017-07-03 Hofftari

https://stackoverflow.com/questions/9616426/javascript-print-iframe-contents-only –

@SagarSinha不知道你想要通過鏈接該頁面。你能否解釋一些更多的或評論你想要參考的那個線索的哪一部分？ – Hofftari

這原來是一個真正的麻煩。我一直都不願意使用iframe，但是由於有很多資源說使用iframe打印比屏幕上顯示的東西更多的東西，我們認爲我們會嘗試一下。

這是通過將數據放入一個隱藏的div中，然後在window.print（）之前顯示來解決的。同時，頁面上的所有其他元素都被賦予了一個「隱藏打印」類，這是一個我們已經用來隱藏打印元素的類。

這可能對用戶來說不夠優雅（在用戶退出打印對話框之前，div會短暫顯示），但這是一種更簡單的代碼來使用和管理。

來源

2017-07-04 12:10:26 Hofftari

我認爲你可以/應該將最後一次focus（）和print（）調用移動到iframe的onload處理函數中，以便在樣式被加載和應用後發生。

來源

2017-07-03 13:09:23

你能否解釋一下如何爲iframe做一個onload處理？更確切地說，如何真正讓iframe獲得這個處理程序而不是整個文檔。 – Hofftari

我剛剛碰到同樣的問題，做了以下內容：

setTimeout(() => { 
    window.frames["iFrame"].focus(); 
    window.frames["iFrame"].print(); 
}, 500)

這似乎已經整理對我來說。我討厭使用超時，長度猜測工作最好，但因爲它不是系統的關鍵，這是我現在可以運行的東西。

來源

2018-02-19 11:50:11 webnoob

如何使用樣式表打印iFrame？

回答

相關問題