содержания IFrame исчезает на Firefox

Question

Я заполняю пустой IFRAME с основным HTML, используя $iframe.contents().find('body').html(contentBody);

См: http://jsfiddle.net/UjT2b/2/

Это хорошо работает на Chrome. В Firefox я очень быстро вижу содержимое внутри, но потом он внезапно исчезает. Когда я устанавливаю точку останова на этой строке с помощью Firebug, продолжайте работу, содержимое остается внутри. Но если я установил точку останова на линии после, она исчезнет.

Любая подсказка о том, как исправить это?

Answer 1

Я не вижу весь ваш код, но работал с тем, что вы дали мне таким образом, чтобы я это сделал. Существует вероятность того, что вы не дадите сценарию возможность оставить остальную нагрузку 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 внутри элемента данного.

Answer 2

Я столкнулся с подобной проблемой при попытке заполнить динамически созданный 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); 
}