IE 中的 jQuery load() 回调失败答案

【问题标题】：jQuery load() callback failure in IEIE 中的 jQuery load() 回调失败
【发布时间】：2013-12-07 15:25:43
【问题描述】：

大家好，在发布此之前，我已经环顾了很多地方试图解决问题，但无法解决。 This 是我遇到的最接近的东西。

我正在尝试动态创建 iframe 并将内容加载到其 src 中，然后使用回调对其进行处理。与往常一样，除 IE 外，一切都可以在 FF/Chrome 中运行。

我有这样的事情：

var iframe = $('#helloworld');
if (!iframe.exists()) {
    iframe = $('<iframe/>', { 
        id : 'helloworld',
        src : "about:blank"
    }).css({
        width : "100%",
        height : "100%"
    });
}

...

iframe.load(options.src, function() {
    div.append(this);
    $(this).find('body').append(box);
    box.dialog({
        close: function( event, ui ) {
            iframe.load("about:blank");
            div.hide();
        }
    });
});

与许多其他人的问题类似，它在回调时失败。从我在其他帖子中阅读的内容来看，这是由于无效的 html 返回到 iframe，但是，我已经检查过了，我的 html 是有效的。

这是我为 iframe 返回的内容，如您所见，出于测试目的，它已经被剥离到最低限度。

<!DOCTYPE html>
<html dir="ltr">

    <head>
        <title>Testing</title>
        <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
        <style type="text/css">
        </style>
    </head>

    <body></body>

</html>

在 IE 中，jQuery 正在死去@第 5951 行：

append: function() {
    return this.domManip(arguments, true, function( elem ) {
        if ( this.nodeType === 1 || this.nodeType === 11 || this.nodeType === 9 ) {
            this.appendChild( elem );
        }
    });
},

SCRIPT65535：对方法或属性访问的意外调用。 jquery-1.9.1.js，第 5951 行字符 5

this 应该是我的iframe，它没有appendChild 方法。

对我进一步解决此问题有任何提示吗？

【问题讨论】：

您应该删除这个多余的逗号：src : "about:blank",。
我之前有其他东西，我删除了那些其他属性，因为它不适用于这个问题。我原来有allowtransparency : true。
我告诉过你，因为它已经经常发生在我身上，IE 不喜欢额外的逗号：/
是的，我知道，我已经看到了足够多的错误消息，知道我在某处有多余的逗号，哈哈

标签： javascript jquery internet-explorer iframe load

【解决方案1】：

你不能像 iframe 那样使用 load()。如果您想知道内容何时在 iframe 中完成加载，请使用 onload 事件并设置 src 属性。

iframe.on("load", function() {
    //code here
});

iframe.attr("src", options.src);

加载内容后，您将收到回调。

现在要使用iframe中的内容，需要使用contents()

iframe.contents().find("body")...

【讨论】：

【解决方案2】：

据我所知，.load 会将 HTML 加载到指定的节点中。

所以iframe.load(options.src, /* */);

将options.src 的值加载为 iframe 的 HTML 正文。我怀疑你想要那个。

我想你想要：

iframe.attr("src", options.src);
// or
iframe.attr("src", "about:blank");

【讨论】：

我不能使用attr()，因为源没有完全加载，我的后续代码会失败。我需要等待内容加载完毕，然后对其进行处理。