Gioca un segnale acustico sul pulsante clic

Question

OK Ho letto più risposte qui, ma non mi ha aiutato a tutti (in realtà, nessuno di loro è stato accettato come risposta)

domanda è come " Gioca un segnale acustico" sul 'scatto del tasto'

sto cercando di fare un sito web che funziona su dispositivo touchscreen quindi voglio ogni bottone eventi click giocheranno un segnale acustico, che dovrebbe essere più bello per gli utenti che utilizzando il sitoweb. Il file audio Beep è qui: http://www.soundjay.com/button/beep-07.wav. Ho solo bisogno di questo lavoro su Google Chrome (supporta HTML5)

capisco questo bisogno di lavorare sul lato client così ho provato questo:

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> 

Ma non funziona, non succede nulla quando clicco sul pulsante.

Answer 1

Si potrebbe utilizzare un tag audio in questo modo:

<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> 

Ecco un Plunker

Answer 2

Questo funziona bene

function playSound() { 
 
    document.getElementById('play').play(); 
 
}

<audio id="play" src="http://www.soundjay.com/button/beep-07.wav"></audio> 
 

 
<button onclick="playSound()">Play</button>

Answer 3

approccio semplice (senza HT ML)

var audio = new Audio('audio.mp3'); // define your audio 

$('.btn').click(audio.play); // that will do the trick !! 

---

LIMITAZIONI

Tuttavia, si noterà che se si tenta di riffleClick su un .btn il giocatore non si attiverà tanto suoni i clic (questo è il caso con tutte le anche altre soluzioni). Questo perché il giocatore deve attendere la fine dell'audio per poterlo riprodurre di nuovo. Per sbarazzarsi di questo, questa è l'unica soluzione che ho trovato:

// 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 
} 

Answer 4

stato alla guida mi fa impazzire, ma con JQuery ho trovato una soluzione ... non proprio il modo migliore per farlo, ma funzionato correttamente per me ...

function ding() { 
     $("body").append('<embed src="/ding.mp3" autostart=false autoplay=false type="audio/mpeg" loop="false" width="0" height="0" id="beep" enablejavascript="true" />'); 
     setTimeout(function(){ $("#beep").remove(); },2000); 
} 

non so quanto del tag embed è veramente necessario, ma una volta che ha iniziato a lavorare, ho smesso di scrivere (embed copiato da un'altra soluzione).

Spero che questo aiuti qualcun altro (o mi aiuta il tempo dopo mi dimentico)