Как предотвратить перезагрузку iframe при перемещении его в DOM - PullRequest
26 голосов
/ 15 сентября 2011

У меня есть iframe, загруженный некоторым контентом. Я хотел бы переместить его в DOM, не вызывая обновления (мне нравится содержимое внутри, я хочу сохранить его).

Я делаю некоторые базовые node.appendChild(iframe), чтобы выполнить работу.

Возможно ли это?

Заранее спасибо за помощь.

Ответы [ 4 ]

16 голосов
/ 15 сентября 2011

Если вы пытаетесь переместить его визуально, вы можете попробовать изменить CSS, чтобы использовать абсолютное позиционирование или некоторые другие корректировки.

Однако, если вы пытаетесь фактически вытащить его из DOM ивставьте его куда-нибудь еще, вы не сможете избежать перезагрузки.

2 голосов
/ 15 сентября 2011

Я так не думаю, так как браузер собирается перерисовать / перезагрузить iframe, когда он возвращается в DOM.

http://polisick.com/moveNode.php лучше объясняет это.

Чтобы переместить узел, вы вызываете метод removeNode, чтобы вывести его из дерева в память, а затем добавьте узел, чтобы «вставить» его туда, где вы хотите.

0 голосов
/ 10 июля 2014

У меня была похожая проблема с iFrame в диалоговом окне jQueryUI. jQuery перемещает div (содержащий мой iFrame) из DOM, и так как я все еще хотел postbacks (duh), мне пришлось переместить его обратно Прочитав этот и несколько других постов, я нашел решение.

Простая идея, которую я заметил, заключается в том, что iFrame перезагружается при его перемещении. Итак, я добавил iFrame в контейнер диалога (div) после перемещения div обратно в DOM. Это работает, потому что jQuery не заботится о том, что находится в контейнере. Вот пример кода:

Функции открытия / закрытия диалога:

открыто:

function () {
    $(this).parent().appendTo("form").css("z-index", "9000"); //Move the div first
    $(this).append('<iframe id="iFrame" allowtransparency="true" frameborder="0" width="100%" height="100%" src="somePage.aspx"></iframe>');}, //then add the iframe
}

закрыть:

function() {
    $(this).empty(); //clear the iframe out because it is added on open, 
    //if you don't clear it out, you will get multiple posts
    $(this).parent().appendTo("divHidden"); //move the dialog div back (good house-keeping)
}

HTML:

<div id="divHidden" style="display: none">
    <div id="dialog" style="display: none">
    </div>
</div>
0 голосов
/ 05 ноября 2013

вам нужно сохранить узел 'Html' под iframe и после того, как вы переместили iframe, добавьте его обратно

...