iframe內容在Firefox上消失了

Question

我使用基本HTML填充空iframe，使用$iframe.contents().find('body').html(contentBody);

請參閱： http ： //jsfiddle.net/UjT2b/2/

這適用於Chrome。 在Firefox上，我可以非常簡單地看到里面的內容，但隨后它突然消失了。 當我使用Firebug在此行上設置斷點，然后繼續運行時，內容保持在內部。 但如果我在線上設置斷點，它就會消失。

關於如何解決這個問題的任何線索？

Answer 1

我在嘗試填充動態創建的iframe時遇到了類似的問題。 使用iframe onload事件為我解決了這個問題。 正如所見，onload解決方案不適用於除FF以外的其他瀏覽器，因此保留了標准方式。

/**
 * Fills an iframe using data stored within textarea. Useful for creating email
 * template previews
 *
 * @param  {String} inputSelector
 * @param  {String} outputElemClasses
 * @return void
 */
function displayEmail(inputSelector, outputElemClasses)
{
    $(inputSelector).each(function(i) {
        var templateData = $(this).text();
        var $iframe = $('<iframe></iframe>');
        $iframe.addClass(outputElemClasses);
        $iframe.insertAfter(this);
        // non-firefox
        updateIframe($iframe, templateData);
        // firefox
        $iframe.load(function(e){
            updateIframe($iframe, templateData);
        })
    })
}


/**
 * Fills in target iframe using supplied data
 *
 * @param  {Object} $iframe
 * @param  {String} data
 * @return void
 */
function updateIframe($iframe, data)
{
    $iframe.contents().find('html').html(data);
}            

Answer 2

我看不到你的整個代碼，但是以我會做的方式與你給我的東西一起工作。 有可能你沒有讓腳本有機會在HTML執行之前讓其余的HTML加載，從而發生不可預測的事情。 我發現，如果我不等待窗口加載，那么圖像將不會顯示。 如果你把你所做的一切都包括在內，如下所示，那么你應該沒有問題：

$( window ).load( function() {

    var html = "<img src='http://www.google.fr/logos/2011/Louis_Daguerre-2011-hp.jpg' alt='image' />";


    $( "#myIframe" ).contents().find( 'body' ).html( html );

});

請記住，jQuery.html（）將替換給定元素中的所有HTML。