动态创建的 iframe 用于下载文件触发器 onload 与 firebug 但并非没有答案

【问题标题】：Dynamically created iframe used to download file triggers onload with firebug but not without动态创建的 iframe 用于下载文件触发器 onload 与 firebug 但并非没有
【发布时间】：2010-03-16 17:34:39
【问题描述】：

编辑：由于这个问题现在已经“解决”到可以工作的地步，我正在寻找有关原因的信息。有关修复，请参阅下面的评论。

我有一个 Web 应用程序，它动态地（在超时后或按照用户的指示）将 wav 文件动态地下载到 iframe 中，以触发默认音频播放器播放它们。该应用程序仅针对 FF 2 或 3。为了确定文件何时完全下载，我希望对 iframe 使用 window.onload 处理程序。基于this stackoverflow.com answer，我每次都在创建一个新的 iframe。只要在使用该应用程序的浏览器上启用了 firebug，一切都会运行良好。没有萤火虫，onload 永远不会触发。 firebug 的版本是 1.3.1，而我测试了 Firefox 2.0.0.19 和 3.0.7。任何想法如何从 iframe 获取 onload 以在下载 wav 文件时可靠地触发？还是有其他方式来表示下载完成？以下是相关代码：

HTML (hidden 的唯一属性是 display:none;):

<div id="audioContainer" class="hidden">
</div>

JavaScript（也可以使用 jQuery，但根据我的阅读，innerHTML 比 html() 更快）：

waitingForFile = true; // (declared at the beginning of closure)
$("#loading").removeClass("hidden");
var content = "<iframe id='audioPlayer' name='audioPlayer' src='" +
    /path/to/file.wav + "' onload='notifyLoaded()'></iframe>";
document.getElementById("audioContainer").innerHTML = content;

还有notifyLoaded的内容：

function notifyLoaded() {
    waitingForFile = false; // (declared at beginning of the closure)
    $("#loading").addClass("hidden");
 }

我也尝试过通过 document.createElement 创建 iframe，但我发现了同样的行为。每次启用 firebug 时都会触发 onload，并且永远不会没有它。

编辑： 修复了有关如何声明 iframe 的信息并添加了回调函数代码。不，这里没有 console.log 调用。

【问题讨论】：

由于某种原因，获取 iframe 的 contentDocument 并在那里设置 onload 会导致 HTML 中的 onload 被触发。我需要添加到容器的 HTML 中的 onload 和 contentDocument.onload = 调用。任何想法为什么会受到赞赏！

标签： javascript iframe firebug download wav

【解决方案1】：

老问题，但供将来参考：就我的经验而言，文件下载不需要 onLoad。解决它的一种方法是像他们在这里一样使用 cookie http://gruffcode.com/2010/10/28/detecting-the-file-download-dialog-in-the-browser/

【讨论】：

链接已失效！
我可以在复制粘贴到新标签时打开链接。当引荐网址是此页面时，此页面是否被阻止？ :)

【解决方案2】：

这是一个适用于我的示例，没有打开 Firebug（在 FF 3.6.2 Mac 中测试）：http://www.jsfiddle.net/Kukry/

我正在使用 jQuery .load() 事件而不是 onload。

var iframe = $("<iframe/>").load(function () {
    alert("loaded");
}).attr({
    src: "http://code.jquery.com/jquery-1.4.2.min.js"
}).appendTo($("#thediv"));

请注意，我加载的是 JavaScript 文件，而不是音频文件，所以这可能会有所不同。

【讨论】：

如评论中所述，通过在代码中设置 onload 以及触摸内容文档。感谢您的建议，但使用 jQuery 的加载功能不起作用 - 我尝试了多次。我仍在寻找解释为什么在 iFrame 的 contentDocument 中设置 onload 会使一切正常。我最好的猜测是它导致加载事件被触发，因为在 contentDocument 中设置了一些东西。

【解决方案3】：

也许你在某个地方调用了一些 Firebug 内部函数，比如 console.log()？在这种情况下，Firefox 会抛出一个异常，如果 Firebug 未激活，该异常会停止执行。

【讨论】：