...

View Full Version : Play Sound



cmc
05-24-2005, 01:31 AM
How do you play a sound from an onClick event?

tia,
cmc

_Aerospace_Eng_
05-24-2005, 01:40 AM
Here is how you do it with a link onclick, if you want to give the user some controls, then check out the Embedded Windows Media Player thread(under Multimedia) there are a few versions there.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript"><!--
function play(what){
document.getElementById('music1').innerHTML="<embed type='application/x-mplayer2' id='music2' pluginspage='http://www.microsoft.com/Windows/MediaPlayer/' src='"+what+"' name='MediaPlayer1' width='1' height='1' controltype='2' showcontrols='1' showstatusbar='1' AutoStart='true' loop='false'></embed>";
}
function stopsong(){
document.getElementById('music1').innerHTML="";
}
//-->
</script>
</head>
<body>
<a href="http://urltosonghere.mp3" onclick="play(this.href);return false">Play Clip</a>
<br>
<a href="#" onclick="stopsong();return false">Stop Clip</a>
<br><br>
<span id="music1"></span>
</div>
</body>
</html>

Scootertaj
05-24-2005, 01:43 AM
Here is how you do it with a link onclick, if you want to give the user some controls, then check out the Embedded Windows Media Player thread(under Multimedia) there are a few versions there.

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript"><!--
function play(what){
document.getElementById('music1').innerHTML="<embed type='application/x-mplayer2' id='music2' pluginspage='http://www.microsoft.com/Windows/MediaPlayer/' src='"+what+"' name='MediaPlayer1' width='1' height='1' controltype='2' showcontrols='1' showstatusbar='1' AutoStart='true' loop='false'></embed>";
}
function stopsong(){
document.getElementById('music1').innerHTML="";
}
//-->
</script>
</head>
<body>
<a href="http://urltosonghere.mp3" onclick="play(this.href);return false">Play Clip</a>
<br>
<a href="#" onclick="stopsong();return false">Stop Clip</a>
<br><br>
<span id="music1"></span>
</div>
</body>
</html>

Just one reason Aerospace has gotten many nominations for helpful member :thumbsup:

_Aerospace_Eng_
05-24-2005, 01:48 AM
heh, thanks scooter. :)

cmc
05-24-2005, 01:50 AM
Thanks for the speedy replies, You guys are awesome. The code you provided opens up another page, My goal is to utilize a <input type='button' value='Play Sound' onClick='javascript()'> that will play a wav file without opening another page.

tia,
cmc

_Aerospace_Eng_
05-24-2005, 01:52 AM
No, no it doesn't open another page. You may have used the script incorrectly. Any go I supply is tested before I give it to someone. Can you show us the code to your page in question along with the script I provided inside it?

Cranford
05-24-2005, 02:02 AM
<HTML>
<Head>
<Script Language=JavaScript>

function playIt(URL){

isSelection = URL;
embedStr = "<Embed Src="+isSelection+" Width=70 Height=40></Embed>"
document.getElementById('isEmbed').innerHTML = embedStr;
}

</Script>
</Head>
<Body>
<Div id='isEmbed'></Div>
<input type=button value="Play Sound" onclick="playIt('http://www.mywebsite.com/media/angie.mp3')">
</Body>
</HTML>

cmc
05-24-2005, 02:16 AM
<script type="text/javascript"><!--
function play(what){
document.getElementById('music1').innerHTML="<embed type='application/x-mplayer2' id='music2' pluginspage='http://www.microsoft.com/Windows/MediaPlayer/' src='"+what+"' name='MediaPlayer1' width='1' height='1' controltype='2' showcontrols='1' showstatusbar='1' AutoStart='true' loop='false'></embed>";
}
function stopsong(){
document.getElementById('music1').innerHTML="";
}
//-->
</script>

This opens up another page.

<a href="http://192.168.0.252/schedule/ding.wav" onclick="play(this.href);return false">Play Clip</a>

What I need is this:

<input type='button' onClick="javascript:play('ding.wav')">

_Aerospace_Eng_
05-24-2005, 02:22 AM
<input type="button" value="Play" onclick="play('http://somesong.mp3')"><input type="button" value="Stop" onclick="stop()">
or use cranford's code, both will work fine.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum