содержание iframe исчезает в Firefox

Question

Я заполняю пустой iframe базовым HTML, используя $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-кода до его выполнения, что может привести к непредсказуемым последствиям. Я обнаружил, что если я не буду ждать загрузки окна, изображение не будет отображаться. Если вы включите все, что сделали, как показано ниже, у вас не должно возникнуть проблем:

$( 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 внутри данного элемента.