Lecture d'un bip sonore sur le bouton de clic

OK J'ai lu plusieurs réponses ici mais elles ne m'ont pas aidé (en fait, aucune d'entre elles n'est acceptée comme réponse)

La question est de savoir comment "Jouer un bip" sur "bouton"

J'essaie de créer un site Web qui fonctionne sur un appareil tactile, de sorte que je souhaite que tous les événements à boutons-boutons produisent un bip sonore, ce qui devrait être plus agréable pour les utilisateurs qui utilisent le site. Le fichier sonore Beep est ici: http://www.soundjay.com/button/beep-07.wav . J'ai seulement besoin de ce travail sur Google Chrome (prend en charge HTML5)

Je comprends ce besoin de travailler sur le client, alors j'ai essayé ceci:

Javascript:

<script> function PlaySound(soundObj) { var sound = document.getElementById(soundObj); sound.Play(); } </script> 

HTML

 <embed src="/beep.wav" autostart="false" type="audio/mpeg" loop="false" width="0" height="0" id="beep" enablejavascript="true" /> <asp:LinkButton ID="lbtnExit" runat="server" OnClick="lbtnExit_Click" OnClientClick="PlaySound('beep')" CssClass="btn btn-lg btn-danger" Text="Exit <i class='fa fa-sign-out' style='font-size: 40px'></i>"></asp:LinkButton> 

Mais cela ne fonctionne pas, rien ne se produit lorsque je clique sur le bouton.

Vous pouvez utiliser une balise audio comme ceci:

  <audio id="audio" src="http://www.soundjay.com/button/beep-07.wav" autostart="false" ></audio> <a onclick="playSound();"> Play</a> <script> function playSound() { var sound = document.getElementById("audio"); sound.play(); } </script> 

Voici un plongeur

Cela fonctionne bien

 function playSound () { document.getElementById('play').play(); } 
 <audio id="play" src="http://www.soundjay.com/button/beep-07.wav"></audio> <button onclick="playSound()">Play</button> 

APPROCHE SIMPLE (sans HTML)

 var audio = new Audio('audio.mp3'); $('.btn').click( function() { audio.play(); // that will do the trick !! } 

Si l'audio est une variable globale, vous pouvez également insérer un html surClick

 <a onclick="audio.play()">My button</a> 

LIMITES

Cependant, vous remarquerez que si vous essayez de riffleCliquez sur un .btn le joueur ne déclenchera pas autant de sons que de clics (c'est le cas avec toute autre solution). C'est parce que le joueur doit attendre la fin de l'audio pour pouvoir le reproduire. Pour s'en débarrasser, c'est la seule solution que j'ai trouvée:

 // array with as much same sounds as needed // the more in the array, the faster you can retrigger the click var audio = [new Audio('audio.mp3'), new Audio('audio.mp3')]; var soundNb = 0; $('.btn').click( function() { audio[ soundNb % audio.length ].play(); // soundNb++; // next sample }