Как сделать так, чтобы ссылка AJAX работала после ее перемещения из iFrame?

Question

Я использую iFrame с формой, которая возвращает некоторый контент со ссылкой AJAX.
Затем я перемещаю возвращенный контент из iFrame на главную страницу.

Однако ссылка ajax не работает, и при щелчке ссылки создается ошибка «Элемент пуст».

Как я могу переместить контент из iFrame, и при этом ссылка AJAX все еще работает?

Вот код, возвращаемый iFrame:

<span id="top">
    <a id="link8" onclick=" event.returnValue = false; return false;" href="/item_pictures/delete/7">
       <img src="/img/delete.bmp"/>
    </a>

    <script type="text/javascript">
        parent.Event.observe('link8', 'click', function(event) { 
           new Ajax.Updater('top','/item_pictures/delete/3', {
               asynchronous:true, evalScripts:true, 
               onCreate:function(request, xhr) {
                     document.getElementById("top").innerHTML = "<img src=\"/img/spinner_small.gif\">";
               }, 
               requestHeaders:['X-Update', 'top']
           }) 
        }, false);
    </script>

</span>

Answer 1

Я переместил вызов AJAX во внешний js-файл и вызвал функцию после щелчка по ссылке. Это работает сейчас.

Answer 2

Я вижу две проблемы с вашим кодом.

Первое решение (я думаю: -))

Когда загружается ваш iframe, запускается javascript. Javascript присоединяет наблюдателя к ссылке родительского документа8.

Внутри наблюдателя вы определяете другую функцию (onCreate). Эта функция будет работать в контексте iframe, заставляя объект документа ссылаться на iframe, а не на основной документ. Когда вы удаляете ссылку 8 из iframe, чтобы переместить ее в основной документ, document.getElementById ("top") станет нулевым - отсюда ошибка.

Возможно, измените его на:

parent.document.getElementById("top").innerHTML = "<img src=\"/img/spinner_small.gif\">";

Вторая проблема (которая на самом деле не является проблемой в данном конкретном случае) заключается в том, что если вы переместите весь промежуток (включая скрипт) в основной документ, javascript снова будет работать в контексте основного документа. В вашем случае вы должны увидеть сообщение об ошибке или предупреждение после перемещения содержимого, указывающее, что родительский элемент является нулевым (или похожим).

Чтобы устранить вторую проблему, верните данные iframe в два деления или аналогичные. Затем скопируйте только div с html в основной документ.