预加载音频文件/事件?
Posted
技术标签:
【中文标题】预加载音频文件/事件?【英文标题】:Preload Audio Files / Event? 【发布时间】:2012-02-17 16:43:47 【问题描述】:在启动基于 JS 的应用程序之前,我正在预加载我的所有资产:
assets = [....]; // files
$.each(assets,function()
var r = /\.([^\.]+)$/;
var ext = r.exec(this); //get file type
if (ext[1] == 'png')
var tmp = new Image();
else if (ext[1] == 'mp3')
var tmp = new Audio();
tmp.src = this;
tmp.onload = function()
var i = assets.indexOf(this);
assets.splice(i,1);
if (!assets.length)
console.log('all loaded');
app.build();
);
当我的数组中只有 png
s 时,这很好用,但是当我添加音频 (mp3s) 时,DOM 元素被创建,但它永远不会触发 onload
,因此应用程序永远不会启动。我已经尝试添加tmp.load()
,但没有任何区别——我也无法在网上找到任何全面的信息。这种方法甚至可能吗? Audio()
是否会触发适当的事件?谢谢!
【问题讨论】:
preload
属性对你没有好处吗?
【参考方案1】:
您正在寻找media events,它表示您可以使用例如loadeddata
.
我想谈谈其他几点:
正则表达式字符组中的字符不需要转义。 为什么不使用 jQuery 来创建元素和绑定事件处理程序?我稍微修改了你的代码:
$.each(assets, function()
var r = /\.([^.]+)$/,
ext = r.exec(this), //get file type
tmp = ext[1] === 'png'
? $("<img>")
: $("<audio>"),
eventName = ext[1] === 'png'
? 'load'
: 'loadeddata';
tmp
.on(eventName, function()
var i = assets.indexOf(this);
assets.splice(i, 1);
if (!assets.length)
console.log('all loaded');
app.build();
)
.attr("src", this); // only set after adding the load callback
// to avoid a possible race condition
);
【讨论】:
感谢 RegExp 的提示以上是关于预加载音频文件/事件?的主要内容,如果未能解决你的问题,请参考以下文章