Question

我想在我正在制作的游戏中为按钮添加声音片段。目前它没有做任何事情，我不知道为什么。

目前在脚本中我有......

var audio = $(".mysoundclip")[0];
$(".minibutton").onclick(function() {
    audio.play();
});

在HTML中我有......

<audio id="mysoundclip" preload="auto">
    <source src="http://www.wav-sounds.com/cartoon/bugsbunny1.wav"></source>
</audio>

然后我有.minibutton的CSS。

为什么它不会起作用的任何想法？

Answer 1

你的jQuery中有一些简单的错误。

HTML

<audio id="mysoundclip" preload="auto">
    <source src="http://www.wav-sounds.com/cartoon/bugsbunny1.wav"></source>
</audio>
<button type="button">play</button>

的jQuery

var audio = $("#mysoundclip")[0];
$("button").click(function() {
    audio.play();
});

小提琴：http://jsfiddle.net/iambriansreed/VavyK/

Answer 2

也许我太可疑了......但是

http://www.sound-effect.com/sounds1/animal/Saf/Tiger1.wav“在此服务器上找不到请求的网址”

如果这只是一个拼写错误，你还应该尝试找出浏览器能够播放的音频类型：

myApp.htmlAudio = (function _htmlAudioCheck() {
    var elem = document.createElement('audio'),
        bool = false;

    try {
        if( !!elem.canPlayType ) {
            bool = new Boolean(bool);
            bool.ogg = elem.canPlayType('audio/ogg; codecs="vorbis"');
            bool.mp3 = elem.canPlayType('audio/mpeg;');

            bool.wav = elem.canPlayType('audio/wav; codecs="1"');
            bool.m4a = ( elem.canPlayType('audio/x-m4a;') ||      elem.canPlayType('audio/aac;'));
        }
    } catch(e) { }

    return bool;
}());

现在我们可以查看

if( myApp.htmlAudio && myApp.htmlAudio.wav ) {
}

例如，如果浏览器能够播放.wav个文件。

但是，我从未见过source element的嵌套audio elements。如果有的话，那应该被命名为track。但是你真的不需要这个，你可以在src本身上拥有audio element属性。示例：http://jsfiddle.net/5GUPg/1/

为点击事件添加音频

2 个答案: