Получение формы Google в IFrame с автоматической высотой - PullRequest
Новая
       19

Получение формы Google в IFrame с автоматической высотой

4 голосов
/ 22 марта 2012

Итак, у меня есть форма, которую я создал с помощью Документов Google, потому что она казалась проще, чем идти с нуля. Я заставил это работать, скопировав код со страницы Google на страницу моего домена.

Мне удалось автоматически настроить его высоту с помощью этого прекрасного небольшого скрипта, который я нашел здесь: http://www.frontpagewebmaster.com/m-89000/tm.htm (это не очередная тема о том, КАК динамически изменять размер iframe) 

function changeContent() { 
document.getElementById('contentDIV').innerHTML = window.frames['contentFRAME'].document.getElementsByTagName('html')[0].innerHTML;
}

и iframe на МОЕЙ отображаемой странице: 

<div class="right" id="contentDIV">
<iframe id="contentFRAME" src="raw-form.html" name="contentFRAME" onLoad="changeContent()" style="height:0; width:0; border-width:0;">Loading...</iframe>
</div>

Но теперь, когда я нажимаю "Отправить", страница подтверждения или ошибки открывается в окне _parent (может быть _top), а не в iframe (_self, который должен быть по умолчанию?). target = "" устарела и не работает. Это также происходит с ЛЮБОЙ ссылкой внутри iframe. Я пробовал пару различных сценариев изменения размера, но я не знаю достаточно, чтобы понять это? Или код на самом деле не работает для моих целей? Я не уверен ... Вот что у меня работает: http://fiendconsulting.com/60minutedesign/form-embed.html

Что мне нужно : что-то, что изменяет размер содержимого iframe при первой загрузке родительской страницы и открывает все ссылки в их _self рамке / странице / что угодно.
Что меня не волнует : изменение размера фрейма в соответствии с содержанием последующих страниц. Если я нажму на ссылку внутри iframe, мне не нужно изменять размер iframe до той страницы, на которую я только что зашел.

Я программист-самоучка, и у меня есть некоторые интересные пробелы в моих знаниях. Я также только начал изучать JS и PHP и нахожусь на стадии чтения, комментирования и каннибализации. Лучше предположить, что я не знаю, и это помогло бы мне много, если бы вы сказали мне, куда поместить код (какой документ и где в документе). :)

1 Ответ

0 голосов
/ 17 января 2014

Я не уверен в том, что вы пытаетесь сделать, потому что предоставленные вами ссылки, похоже, не работают; однако, я полагаю, что ваша проблема может быть связана с функцией изменения размера.

Ваша функция: 

function changeContent() { 
document.getElementById('contentDIV').innerHTML = window.frames['contentFRAME'].document.getElementsByTagName('html')[0].innerHTML;
}

Вы берете элемент 'contentDiv', вы берете HTML-код вашего 'iframe', а затем устанавливаете то же самое для вашего div содержимого. Это приводит к тому, что ваш iframe больше не существует.

Например:

скажем, у моего содержимого div было это: 

<div class="right" id="contentDIV">
<iframe id="contentFRAME" src="raw-form.html" name="contentFRAME" onLoad="changeContent()" style="height:0; width:0; border-width:0;">Loading...</iframe>
</div>

В моем iframe есть только 1 ссылка: <a href="www.example.com">Example Link</a>

После вашей функции ваш contentDiv теперь выглядит так: 

<div class="right" id="contentDIV">
<a href="www.example.com">Example Link</a>
</div>

Вы фактически удалили свой iframe и поместили содержимое iframe (ссылку) в свой основной div. Теперь, если вы щелкнете по элементу, он автоматически откроется на той же странице - то есть «родительский», но родительского элемента больше нет!

Итак, в дальнейшем вы не должны заменять контент; вместо этого вы должны изменить высоту / ширину фрейма. Посмотри на: Отрегулируйте высоту ширины iframe, чтобы она соответствовала содержанию в нем

...