Play a sound each time a button is clicked

Question

I've struggled some time to find a working way of playing a sound when a linked is clicked on, and finally came up with the following:

<audio id="sound0" src="/sounds/foo">

<a href="javascript:play('sound0');">Click here</a> 

<script>function play(sound_id) {
    document.getElementById(sound_id).play();
}</script>

Now, this works fine, but only the first time the link is clicked on; after that, clicking again on it doesn't have any effect.

How can I fix this?

http://stackoverflow.com/questions/12953928/immediate-play-sound-on-button-click-in-html-page try to see this they want this too — MickyScion, Jun 26 '14 at 21:53

score 1 · Answer 1 · answered Jun 26 '14 at 22:06

1

Think you just need to rewind the sound. Try...

 document.getElementById(sound_id).currentTime=0; 
 document.getElementById(sound_id).play();

answered Jun 26 '14 at 22:06

RichardB

2,615
1
11
14

score 0 · Answer 2 · answered Jun 26 '14 at 23:34

I finally fixed this up thanks to the link @MickyScion posted in the comment. The fix is to not use the <audio> tag:

<a href="javascript:play('/sounds/foo');">Click here</a> 

<script>function play(path) {
    var sound = new Audio(path);
    sound.play();
}</script>

Rewinding the source seems to be necessary.

Play a sound each time a button is clicked

2 Answers2