nội dung iframe biến mất trên Firefox

Question

Tôi điền một iframe trống với HTML cơ bản, sử dụng $iframe.contents().find('body').html(contentBody);

Xem: http://jsfiddle.net/UjT2b/2/

này hoạt động tốt trên Chrome. Trên Firefox, tôi có thể thấy rất ngắn gọn nội dung bên trong, nhưng sau đó nó đột nhiên biến mất. Khi tôi đặt điểm ngắt trên dòng này bằng Firebug, sau đó tiếp tục chạy, nội dung nằm bên trong. Nhưng nếu tôi đặt một điểm ngắt trên đường dây sau đó, nó sẽ biến mất.

Bất kỳ đầu mối nào về cách sửa lỗi này?

Answer 1

Tôi không thể nhìn thấy toàn bộ mã của bạn, nhưng đã làm việc với những gì bạn đã cung cấp cho tôi theo cách tôi sẽ làm. Có một cơ hội mà bạn không cho kịch bản cơ hội để cho phần còn lại của tải HTML trước khi nó được thực hiện và do đó những điều không thể đoán trước có thể xảy ra. Tôi thấy rằng nếu tôi không chờ đợi cho cửa sổ để tải sau đó hình ảnh sẽ không hiển thị. Nếu bạn mã hóa mọi thứ bạn đã làm, như dưới đây, thì bạn không nên gặp sự cố:

$(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); 

}); 

Chỉ cần nhớ rằng jQuery.html() sẽ thay thế tất cả HTML bên trong phần tử đã cho.

Answer 2

Tôi đã gặp sự cố tương tự trong khi cố gắng lấp đầy iframe được tạo động. Sử dụng sự kiện onrame onrame đã giải quyết được tình huống cho tôi. Như đã thấy, giải pháp onload không hoạt động đối với các trình duyệt khác ngoài FF, do đó được bảo quản theo cách tiêu chuẩn.

/** 
* 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); 
}