带有 iframe 的 jQuery .empty()，其 src 是 Internet Explorer 中的 pdf 中断插件

Posted 2023-05-09

【中文标题】带有 iframe 的 jQuery .empty()，其 src 是 Internet Explorer 中的 pdf 中断插件

【英文标题】：jQuery .empty() with iframe whose src is a pdf breaks plugin in internet explorer

【发布时间】：2013-07-07 13:47:53

【问题描述】：

在 Internet Explorer 8-10 中，如果我有一个源为 PDF 的 iframe，并且该 iframe 被包装在一个 div 中，并且我在该包装 div 上调用 jQuery.empty()，那么两者之间似乎存在某种交互PDF 插件和 IE 导致插件中断，变得非交互（从 DOM 中删除后无法对文档执行任何操作），并且在某些情况下忽略滚动，浮动在页面上方。

示例代码：

<button id="remove">remove</button>
<div style="height:2000px">
    <div style="height:500px; width:800px;" id="embedDiv">
        <iframe style="width:100%; height:100%;" src="somepdf.pdf"></iframe>
    </div>
</div>

<script type="text/javascript">
    $(function () 
        $("#remove").click(function () 
            $("#embedDiv").html("Some Content!");
        );
    );
</script>

可以在http://jsfiddle.net/j2e56/找到工作示例

在调用 .empty() 之后，有没有办法隐藏/删除这个嵌入的 pdf？我在一个我真的不知道如何或何时从页面中删除我的框架的环境中工作，并且我无法控制如何删除它。事后我可以使用 setInterval 定期检查 iframe 是否仍在文档上，但我不知道该怎么做。

将框架上的src 属性设置为'' 或'about:blank' 将在调用empty() 之前起作用，但之后似乎没有任何效果，这似乎是我在这种情况下陷入困境的地方.

【问题讨论】：

您是否尝试过在 iframe 上调用 .remove 而不是在 div 上调用 .empty？

问题是我处于 CMS 的情况下，我不知道谁会移除我，他们什么时候会做，或者他们会如何做。有几种方法可以成功删除 IE 中的嵌入式插件，但我找不到任何可以在框架脱离 dom 之后 起作用的方法。我得到的唯一需要隐藏框架的信号是在框架被移除之后。

我不确定你的意思。 .html("Some content!") 代码是否驻留在您的文件中？我的提议是用$("#embedDiv iframe").remove() 替换你的$("#embedDiv").html("Some Content!");，如果你有选择的话

抱歉，我无法控制如何删除 iframe。可能是 .html(content)，可能是 .remove()，可能是 .empty()，可能根本不是 jquery。它可以直接在 iframe 元素上，也可以是树上某处的父 div。我正在尝试弄清楚一旦触发此错误，我是否可以采取任何防御措施来清理它。

好吧，我明白了，只是另一个想法：尝试将 onbeforeunload 事件附加到 iframe

【参考方案1】：

好的，这不是完美的解决方案，但现在可以使用。

解决方案是附加到 onbeforeunload，但问题是一旦转换为 pdf iframe，IE 将不会支持这些回调。所以我所做的是在文档中的 pdf iframe 之前添加一种“金丝雀”iframe，并附加到卸载那个 iframe。当检测到卸载情况时，canary 卸载回调将 pdf iframe 上的 src 设置为 ''，以便成功卸载。

请注意，这仅在您在调用 html() 之前使用 .empty() 时才有效。

编辑：这是错误的，它仅在您针对 iframe 的直接父级调用它而不是高于它的任何内容时才有效。