Ajout d'un événement audio à un clic

Question

Je souhaite ajouter un clip audio à un bouton sur un jeu que je crée. Actuellement, il ne fait rien et je ne sais pas pourquoi.

Au moment Dans le script, j'ai ...

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

Dans le HTML ... Je

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

Ensuite, je dois CSS pour .minibutton.

Des idées pour lesquelles cela ne fonctionnera pas?

Answer 1

Votre jQuery contenait quelques erreurs simples.

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(); 
});​ 

Fiddle: http://jsfiddle.net/iambriansreed/VavyK/

Answer 2

Peut-être que je suis trop suspicous .. mais

http://www.sound-effect.com/sounds1/animal/Saf/Tiger1.wav « L'URL demandée n'a pas été trouvée sur ce serveur »

Si c'est juste une faute de frappe, vous devriez aussi essayer de comprendre quels types audio un navigateur est capable de jouer:

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; 
}()); 

maintenant, nous pouvons vérifier comme

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

si le navigateur est capable de lire des fichiers .wav par exemple.

Cependant, je n'ai jamais vu un source element imbriqué pour audio elements. Cela devrait être nommé track si quelque chose. Mais vous n'avez pas vraiment besoin de cela ici, vous pouvez simplement avoir un attribut src sur le audio element lui-même. Exemple: http://jsfiddle.net/5GUPg/1/