Playing sound with JavaScript

Question

Doesn't matter what I do, I simply can't get this to play a sound in Firefox or IE, or Chrome for that matter.

<html>
<head>
<script type="text/javascript">

    function play() 
 {
     var embed = document.createElement('object');

     embed.setAttribute('src', 'c:\\test.wav');
     embed.setAttribute('hidden', true);
     embed.setAttribute('autostart', true);
     embed.setAttribute('enablejavascript', true);

     document.childNodes[0].appendChild(embed);

 }

// -->
</script>
</head>
<body onload="play();">
</body>
</html>

**Please do not** have background sounds play automatically when the page loads. It is one of the most annoying things a webpage can do (see http://www.seomoz.org/blog/how-to-convince-a-client-their-site-doesnt-need-music). At least have an option to mute it. — In silico, Aug 04 '10 at 05:33

Kranu · Accepted Answer · 2010-08-04T06:37:45.043

6

Try using this revised version of the function play()

function play() 
{
  var embed=document.createElement('object');
  embed.setAttribute('type','audio/wav');
  embed.setAttribute('data', 'c:\test.wav');
  embed.setAttribute('autostart', true);
  document.getElementsByTagName('body')[0].appendChild(embed);
}

The problem with your code was you were using the src attribute, which is for the <embed> tag. Instead, use the data attribute for the <object> tag.

If you are trying to get the most compatibility out of this, you should also consider adding the embed tag as an alternate for the object tag. The way it works is like this:

<object data="test.wav" type="audio/wav" autostart="true">
<embed src="test.wav" autostart="true" alt="Could not load audio" />
</object>

This works similar to the noscript tag, where older browsers that don't support the object tag resort to the embed tag.

edited Aug 04 '10 at 06:37

answered Aug 04 '10 at 05:42

Kranu

2,557
16
22

Are you sure that you have a valid WAV file? I tested my code on my computer before posting it, and it worked flawlessly on Google Chrome. Try placing the test.wav file in the same directory as the html file and just setting the data attribute to 'test.wav'. In addition, could you let me know which browser you're using so I can check myself? – Kranu Aug 04 '10 at 06:16
Okay, I moved the file into the same folder, it plays with google chrome, but not with firefox. I actually only need it to work in firefox. – FaNIX Aug 04 '10 at 06:19
I'm glad it works on Google Chrome for you now. I think the reason for it not playing on firefox would be due to security restrictions. For example, when I run the code locally from my computer, it doesn't work. However, I uploaded it http://goo.gl/gjjd and it seems to work fine (with a slight delay because of the host). Let me know what happens for you. – Kranu Aug 04 '10 at 06:26

score 4 · Answer 2 · answered Dec 28 '13 at 23:35

Try This Method, to play sound in all your browsers :

function playSound(soundfile_ogg, soundfile_mp, soundfile_ma) {
    if ("Audio" in window) {
        var a = new Audio();
        if (!!(a.canPlayType && a.canPlayType('audio/ogg; codecs="vorbis"')
                .replace(/no/, '')))
            a.src = soundfile_ogg;
        else if (!!(a.canPlayType && a.canPlayType('audio/mpeg;').replace(/no/,
                '')))
            a.src = soundfile_mp;
        else if (!!(a.canPlayType && a.canPlayType(
                'audio/mp4; codecs="mp4a.40.2"').replace(/no/, '')))
            a.src = soundfile_ma;
        else
            a.src = soundfile_mp;

        a.autoplay = true;
        return;
    } else {
        alert("Time almost up");
    }
}

to play the sound, do something like this:

playSound("/file/horse.wav", "/file/horse.mp3","/file/horse.m4a");

score 0 · Answer 3 · answered Jan 26 '11 at 22:11

FYI using the <embed> tag will invalidate your code. At the moment you have two choices if you want to play sounds on your web page: [1] use the method which works on most browsers today, but which will invalidate your HTML (using <embed>), or [2] use the methods which will only work in some of the latest browsers, but which will be the way to go in the future and also is considered valid HTML (using <audio> or <object>).

Playing sound with JavaScript

3 Answers3

Linked

Related