Question

我们使用simplemodal jquery插件来托管iframe作为对话框的内容。关闭对话框后，simplemodal将从文档中删除对话框内容（包含在div中的iframe），然后将其添加回文档。

下面的标记演示了将simplemodal排除在等式之外的问题。我在这篇文章中只提到了simplemodal，以了解iframe被移除和重新添加的原因。

如果Iframe重新添加到文档中，如何阻止iframe重新加载内容？

非常感谢任何帮助！

的test.html

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <style type="text/css">
        iframe{ padding: 0px; margin: 0px; width: 300; height: 300; }
    </style>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $("#go").click(function() {
                var frame = $("#myframe");

                frame.remove();
                frame.prependTo("body");
            });
        });
    </script>
</head>
<body>
    <iframe name="myframe" id="myframe" src="test2.html"></iframe>
    <div>
        <button id="go">GO</button>
    </div>
</body>
</html>

test2.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <title></title>
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function() {
                alert("this should not get called when the iframe is re-added to the document");
            });
        </script>        
    </head>
    <body>
        This is iframe content.
    </body>
</html>

Answer 1

我认为如果你使用remove（）是不可能的。但也许你可以尝试其他方式，比如改变它的大小，显示：无，不透明度：0，可见性：隐藏或其他。你试过detach（）吗？在jQuery文档中说：要删除元素而不删除数据和事件，请改用.detach（）。

Answer 2

您可以从HTML字符串创建模板，而不是从页面上的元素创建模态。这样，插件就不必从文档中删除iframe，将其放入模态中，然后在模态关闭后将其移回。

Answer 3

我能想到的唯一技巧是将iframe添加到body元素并将其设置为display:none; position:absolute;。然后将一个占位符元素插入到simplemodal中，当显示模态时，使iframe可见并将其位置更改为占位符的位置（也匹配高度和宽度）。

它可能需要摆弄z-index等，但这意味着你不必附加/ prepend /否则改变DOM，从而防止重新加载。

Answer 4

我可以建议你使用div + AJAX。对我来说效果更好，然后iframe，你不必设置iframe和辅助页面的样式。我不知道这是否适合你的需要，但我建议你至少检查一下。

Answer 5

这可能无法解决您的问题，但值得一试..您不需要在prependTo之前调用删除。

prependTo将有效地将其从当前位置取出并将其重新附加到DOM中的其他位置。它不会复制它，因此您不需要“删除”原始

也许这会阻止iframe重新加载。

尽管如此，我同意@ Ryuu的回答，不要费心去讨论iframes。

如何在将Iframe添加到文档时阻止其重新加载？

5 个答案: