Jouer un bip sonore sur un clic de bouton
OK j'ai lu plusieurs réponses ici mais elles ne m'ont pas aidé du tout (en fait, aucune d'elles n'est acceptée comme réponse)
la Question est de savoir comment "Jouer un bip sonore""cliquez sur le bouton"
j'essaie de faire un site web qui fonctionne sur l'appareil d'écran tactile donc je veux que chaque bouton claquer des événements va jouer un son de bip, qui devrait être plus agréable pour les utilisateurs qui utilisent le site web. Bip sonore fichier 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 côté client, j'ai donc essayé ceci:
<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 ça ne marche pas, rien ne se passe quand je clique sur le bouton.
5 réponses
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 Plunker
Cela fonctionne très 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>
avec JavaScript brut, vous pouvez simplement appeler:
new Audio('sound.wav').play()
simple APPROACH (with no HTML)
var audio = new Audio('audio.mp3'); // define your audio
$('.btn').click( audio.play ); // that will do the trick !!
LIMITATIONS
Toutefois, vous remarquerez que si vous essayez de riffleClick sur un .btn
le joueur ne tirera pas autant de sons que de clics (c'est le cas avec toutes les autres solutions aussi). C'est parce que le lecteur a besoin d'attendre la fin de l'audio pour pouvoir le rejouer.
Pour m'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
}
me rend fou, mais avec JQuery j'ai trouvé une solution... pas vraiment la meilleure façon de le faire, mais cela a fonctionné correctement pour moi...
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);
}
Je ne sais pas quelle quantité de la balise embed est vraiment nécessaire, mais une fois qu'elle a commencé à fonctionner, j'ai arrêté d'écrire (embed copié à partir d'une autre solution).
Espérons que cela aide quelqu'un d'autre (ou aide-moi la prochaine fois j'oublie)