根据反馈进行快速编辑:这个问题的一个主要部分是我缺乏经验。如果你能给我一些关于如何调查/调试的提示,我真的很感激。再次感谢。尼尔
我有这个函数/插件,用于在单击元素时播放声音:
(function($){
$.fn.attachSound = function (soundSrc)
{
return this.each(function(index){
var audioElement = document.createElement('audio');
if (audioElement.canPlayType('audio/mpeg') == '')
{
soundSrc = soundSrc.replace('.mp3','.ogg');
}
audioElement.setAttribute('src', soundSrc);
$(this).click(function() {
audioElement.play();
});
})
}
})( jQuery );
以下是我如何称呼它的一个例子:
$(document).ready(function(){
$('#laughter-button').attachSound('sounds/laughter-elf.mp3');
$('#laughter-button2').attachSound('sounds/laughter-santa.mp3');
})
到目前为止,它在Chrome,FF,Opera和Safari(所有当前版本,我还没有在IE上进行测试)中工作。我遇到的问题是在Safari中,它仅适用于第一次用户点击。我想要使用此功能的方法之一是作为基于声音的记忆游戏的一部分,因为它不会这样做。有什么想法吗?
我对编程缺乏经验,而且我从未尝试过闪回技术但是我愿意研究它是如何工作的。也许,有更好的方法,或者你可以指出我正确的方向?
谢谢你, 尼尔
答案 0 :(得分:0)
检查Safari是否支持http://html5test.com/
上的mp3音频/ Html5答案 1 :(得分:0)
我找到了妥协的解决方案。此解决方案在每次单击时创建新音频,而不是仅在document.ready上创建。缺点是它的效率较低,但至少它在Safari中工作。我有办法改进它。现在,虽然我对这个解决方案感到满意,仅仅因为它有效。尽管如此,如果你能想到一个,我肯定愿意接受更好的解决方案。我可能最终会尝试将此代码与浏览器嗅探或其他内容结合起来。感谢所有让我以不同方式思考问题的人。 尼尔
(function($){
$.fn.attachSound = function (soundSrc)
{
return this.each(function(index){
$(this).click(function() {
var audioElement = document.createElement('audio');
if (audioElement.canPlayType('audio/mpeg') == '')
{
soundSrc = soundSrc.replace('.mp3','.ogg');
}
audioElement.setAttribute('src', soundSrc);
audioElement.play();
});
})
}
})( jQuery );