在Firefox中,音频元素不会在iframe内显示/播放

Question

我有这个HTML5片段,允许用户点击并播放一些音频:

<audio controls>
    <source src="cell.ogg">
    <source src="cell.mp3">
    <source src="cell.m4a">
</audio>

这在OS X Lion的FF 8中运行良好.出现音频播放器控件,我可以单击播放,然后播放ogg版本.

但是如果我将包含文件放在另一个HTML5文档的iframe中(都来自本地文件系统;没有跨源问题),那么它就不起作用了.HTML的其余部分显示正常,但Firefox表现得好像它不支持任何媒体格式.

这是我用来将页面添加到iframe的功能:

function postContentToIframe(content)
{
    var iframe = $("#displayContents")[0].contentWindow.document;
    iframe.open(); iframe.close(); // must open and close document object to start using it!
    $("body", iframe).append(content).hide().fadeIn("slow");
    return;
}

这是FF呈现它的方式.

为什么？我该如何解决？TIA.

Answer 1

谜团已揭开。这是一个目录/相对 URL 问题。基本 HTML 文件（带有 iframe 元素）与附加 HTML 文件（iframe 内容）和音频文件位于不同的目录中。因此它找不到音频文件。

解决方案：要么将所有文件放入一个目录，要么（更好）使用绝对 URL 而不是相对 URL。