2015-03-10 9 views
0

Я создаю страницу, которая позволяет людям загружать файл, который затем можно редактировать непосредственно в браузере. То, что я создал до сих пор, - это форма загрузки, которая после отправки загружает содержимое в iframe, добавляя iframe в div.Изменение размера добавленного iframe

При подаче формы следующих Jquery пробегов:

setTimeout(function() { 
    $('.email-body').append('<iframe id=\"emailframe\" scrolling=\"no\" src=\"email/index.html\" width=\"800\" name=\"myFrame\"></iframe>'); 
    $('.emailUploadArea').fadeOut(); 
    $('.email-body').fadeIn(); 
}, 50); 

Эта часть работает просто отлично; форма загрузки исчезает, и появляется iframe с электронной почтой внутри.

Проблема в том, что отображаемый iframe имеет высоту 150 пикселей, и мне нужно, чтобы iframe расширялся, чтобы отобразить весь файл внутри. Я использовал этот jquery, когда iframe был статичным, а не добавлялся.

function resizeIframe() { 
    var iframe_content = $("#emailframe").contents().find('body'); 
    $("#emailframe").css({ 
     height: iframe_content.outerHeight(true) 
    }); 
    iframe_content.resize(function() { 
     var elem = $(this); 
     $("#emailframe").css({ 
      height: elem.outerHeight(true) 
     }); 
    }); 
} 

Но это уже не работает, я предполагаю, потому что JQuery не может найти IFrames идентификатор, как это на самом деле не существует.

Может ли кто-нибудь показать мне, как это сделать, чтобы мой добавленный iframe изменил размер, чтобы показать весь файл.

Благодаря

ответ

0

Вместо добавления строку, содержащую определение в IFRAME, попробуйте создать один динамически первый и сохранение ссылки на него:

var myIframe = $('<iframe id="myFrame" name="myFrame">'); 
myIframe.appendTo('body'); 

Таким образом, вы будете иметь ссылку это позволит вам изменять любые атрибуты, которые вам нужны!

http://jquery-howto.blogspot.com/2010/02/dynamically-create-iframe-with-jquery.html