У меня есть диалоговое окно jQuery UI, которое содержит форму, позволяющую пользователю разместить объявление. Поскольку форма содержит загружаемый файл, ее целью является iFrame.
Из этого iFrame я уничтожаю диалоговое окно в родительском окне и создаю новое (или я изменяю параметры исходного диалогового окна, это не имеет никакого значения). Дело в том, что в iFrame я определяю новые кнопки для нового диалога, которые сами прикрепляются к событиям, работающим с элементами основного окна.
В Firefox, Safari, Chrome это работает на отлично:
var p = parent;
p.$('#dialog_new_ad').html('<form id="post_ad_form" style="display: none" data-remote="true"></form><div class="header"><h1 class="header_title"></h1><div class="header_company"></div><div class="header_location"></div></div><div class="content"></div>');
p.$('#dialog_new_ad').dialog({
minHeight: 600,
width: 800,
position: ['center',25],
modal: true,
autoOpen: false,
title: '<%= 'Preview: ' if params[:action] == 'preview' %><%= @ad.title %>',
buttons: {
"« Back": function() {
p.$('#post_ad_form').attr('method','get');
p.$('#post_ad_form').attr('action','/ads/<%= @ad.id %>/revise');
p.$('#post_ad_form').submit();
},
"Submit »": function() {
p.$('#post_ad_form').attr('method','post');
p.$('#post_ad_form').html('<input type="hidden" name="_method" value="put">');
p.$('#post_ad_form').attr('action',"/ads/<%= @ad.id %>/confirm");
p.$('#post_ad_form').submit();
}
}
});
Этот код находится в iFrame, к которому отправляется форма.
Если вы посмотрите на функции кнопок, вы увидите, что их действия также определяются в контексте дочернего окна (iFrame), даже если кнопки находятся в родительском окне. Это потому, что функция создается в iFrame, и, следовательно, на объекты необходимо ссылаться из этого контекста.
Теперь проблема в том, что в Internet Explorer это работает иногда, но не в других. Когда этого не происходит, я получаю сообщение об ошибке «Не могу выполнить код в освобожденном скрипте», и оно указывает на ту часть jquery-ui.js, где определены функции кнопок. Происходит ли ошибка просто случайно. Как будто это зависит от того, завершилось ли что-то до вызова этого кода. Как уже упоминалось, в любом другом браузере это всегда работает.
Вся вещь (в iFrame) заключена в $(function() { [...] }, поэтому загружается DOM, это не проблема. Это может иметь какое-то отношение к тому факту, что форма, созданная с помощью вызова .html, не «завершается вводом в DOM», когда определены функции кнопок, но это может показаться мне странным. Есть идеи?
Примечание: Функция jQuery .html использует innerHTML для создания новых элементов. Возможно ли, что это приведет к каким-либо проблемам в IE, если на элементы будут ссылаться непосредственно после этого?
Обновление: Я отказался и просто поместил фиктивную форму в родительский элемент, чтобы она всегда могла использоваться дочерними элементами iFrames, независимо от того, загружены они или нет. Когда форма является статической частью родительского HTML и не вставляется динамически, все работает просто отлично. Я до сих пор не понимаю, почему динамическая вставка не работает в IE.