javascript MP3播放器的三种实现方法( 一)

<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<b>在线音乐点播</b></td>
</tr>
</table>
<br>
<table align=center style="font:9pt">
<tr>
<td> <object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95" id="MediaPlayer1" width="286" height="225">
<param name="AudioStream" value="-1">
<param name="AutoSize" value="-1">
<!--是否自动调整播放大小-->
<param name="AutoStart" value="-1">
<!--是否自动播放-->
<param name="AnimationAtStart" value="-1">
<param name="AllowScan" value="-1">
<param name="AllowChangeDisplaySize" value="-1">
<param name="AutoRewind" value="0">
<param name="Balance" value="0">
<!--左右声道平衡,最左-9640,最右9640-->
<param name="BaseURL" value>
<param name="BufferingTime" value="15">
<!--缓冲时间-->
<param name="CaptioningID" value>
<param name="ClickToPlay" value="-1">
<param name="CursorType" value="0">
<param name="CurrentPosition" value="0">
<!--当前播放进度 -1 表示不变,0表示开头 单位是秒,比如10表示从第10秒处开始播放,值必须是-1.0或大于等于0-->
<param name="CurrentMarker" value="0">
<param name="DefaultFrame" value>
<param name="DisplayBackColor" value="0">
<param name="DisplayForeColor" value="16777215">
<param name="DisplayMode" value="0">
<param name="DisplaySize" value="0">
<!--视频1-50%, 0-100%, 2-200%,3-全屏 其它的值作0处理,小数则采用四舍五入然后按前的处理-->
<param name="Enabled" value="-1">
<param name="EnableContextMenu" value="-1">
<!-是否用右键弹出菜单控制-->
<param name="EnablePositionControls" value="-1">
<param name="EnableFullScreenControls" value="-1">
<param name="EnableTracker" value="-1">
<!--是否允许拉动播放进度条到任意地方播放-->
<param name="Filename" value="Music/sayoldtime.mp3" valuetype="ref">
<param name="InvokeURLs" value="-1">
<param name="Language" value="-1">
<param name="Mute" value="0">
<!--是否静音-->
<param name="PlayCount" value="10">
<!--重复播放次数,0为始终重复-->
<param name="PreviewMode" value="-1">
<param name="Rate" value="1">
<!--播放速度1.0-2.0倍的速度播放-->
<param name="SAMILang" value>
<param name="SAMIStyle" value>
<param name="SAMIFileName" value>
<!--选择同时播放(伴音)的歌曲-->
<param name="SelectionStart" value="-1">
<param name="SelectionEnd" value="-1">
<param name="SendOpenStateChangeEvents" value="-1">
<param name="SendWarningEvents" value="-1">
<param name="SendErrorEvents" value="-1">
<param name="SendKeyboardEvents" value="0">
<param name="SendMouseClickEvents" value="0">
<param name="SendMouseMoveEvents" value="0">
<param name="SendPlayStateChangeEvents" value="-1">
<param name="ShowCaptioning" value="0">
<!--是否显示字幕,为一块黑色,下面会有一大块黑色,一般不显示-->
<param name="ShowControls" value="-1">
<!--是否显示控制,比如播放,停止,暂停-->
<param name="ShowAudioControls" value="-1">
<!--是否显示音量控制-->
<param name="ShowDisplay" value="0">
<!--显示节目信息,比如版权等-->
<param name="ShowGotoBar" value="0">
<!--一条框,在下面,有往下箭头-->
<param name="ShowPositionControls" value="-1">
<!--是否显示往前往后及列表,如果显示一般也都是灰色不可控制-->
<param name="ShowStatusBar" value="-1">
<!--当前播放信息,显示是否正在播放,及总播放时间和当前播放到的时间-->
<param name="ShowTracker" value="-1">
<!--是否显示当前播放跟踪条,即当前的播放进度条-->
<param name="TransparentAtStart" value="-1">
<param name="VideoBorderWidth" value="0">
<!--显示部的宽部,如果小于视频宽,则最小为视频宽,或者加大到指定值,并自动加大高度.此改变只改变四周的黑框大小,不改变视频大小-->
<param name="VideoBorderColor" value="0">
<!--显示黑色框的颜色, 为RGB值,比如ffff00为黄色-->
<param name="VideoBorder3D" value="0">
<param name="Volume" value="0">
<!--音量大小,负值表示是当前音量的减值,值自动会取绝对值,最大为0,最小为-9640,最大0-->
<param name="WindowlessVideo" value="0">
<!--如果是0可以允许全屏,否则只能在窗口中查看-->
</object> <br>
<span style="cursor:hand" onClick="alert(document.MediaPlayer1.filename);">查看当前任务</span><br>
<b>MP3点播</b>
<br><span style="cursor:hand" onClick="document.MediaPlayer1.filename='F:/音乐/竞争对手.mp3';">竞争对手</span>
<span style="cursor:hand" onClick="document.MediaPlayer1.filename='F:/音乐/哎呀－王蓉.mp3';">王蓉</span>

<br>
<b>播放速度调整</b>
<script>
var mediaRate=document.MediaPlayer1.Rate;
var mediaVolume=document.MediaPlayer1.Volume;
var mediaCurrentPosition=document.MediaPlayer1.CurrentPosition;
function setRate(num)
{
mediaRate=num;
document.MediaPlayer1.Rate=num;
}
function addCurrentPosition(num)
{
mediaCurrentPosition=document.MediaPlayer1.CurrentPosition;
mediaCurrentPosition+=num;
if(mediaCurrentPosition<0)mediaCurrentPosition=0;
document.MediaPlayer1.CurrentPosition=mediaCurrentPosition;
}
function addVolume(num)
{
mediaVolume=document.MediaPlayer1.Volume;
if(num>0 && mediaVolume<-1)
{
mediaVolume+=num;
if(mediaVolume>-1)mediaVolume=-1;
document.MediaPlayer1.Volume=mediaVolume;
}
else
{
if(num<0 && mediaVolume>-9999)
{ mediaVolume +=num;
if(mediaVolume <-9999)mediaVolume=-9999;
document.MediaPlayer1.Volume=mediaVolume;
}
}
}
function addRate(num)
{
mediaRate=document.MediaPlayer1.Rate;
if(num>0 && mediaRate<12.0)
{
mediaRate+=num;
//if(mediaRate >2.0)mediaRate=2.0;
document.MediaPlayer1.Rate=mediaRate;
}
else
{
if(num<0 && mediaRate>0.1)
{ mediaRate +=num;
if(mediaRate <0.1)mediaRate=0.1;
document.MediaPlayer1.Rate=mediaRate;
}
}
}
function exchangeValue(obj)
{
if(obj=="0")
{
obj="-1";
}
else
{
obj="0";
}
return obj;
}
</script>
<!--速度正常1.0
速度慢0.0<value<1.0
速度快1.0<value<2.0
-->
<span style="cursor:hand" onClick="setRate(1.2);">较快</span> <span style="cursor:hand" onClick="addRate(0.1);">加速</span>
<span style="cursor:hand" onClick="addRate(-0.1);">减速</span> <span style="cursor:hand" onClick="setRate(0.8);">较慢</span>
<span style="cursor:hand" onClick="setRate(1);">正常</span> <span style="cursor:hand" onClick="alert(mediaRate);">查看速度</span>
<br>
<b>播放声音调整</b> <span style="cursor:hand" onClick="document.MediaPlayer1.Mute=exchangeValue(document.MediaPlayer1.Mute);">静音/取消</span>
<span style="cursor:hand" onClick="alert(document.MediaPlayer1.Mute);">查看</span>
<br>
<span style="cursor:hand" onClick="document.MediaPlayer1.Volume=-1">最大</span>
<span style="cursor:hand" onClick="document.MediaPlayer1.Volume=-9999">最小</span>
<span style="cursor:hand" onClick="document.MediaPlayer1.Volume=-180">默认</span>
<span style="cursor:hand" onClick="document.MediaPlayer1.Volume=-259">中大</span>
<span style="cursor:hand" onClick="document.MediaPlayer1.Volume=-399">中等</span>
<span style="cursor:hand" onClick="document.MediaPlayer1.Volume=-999">中小</span>
<span style="cursor:hand" onClick="document.MediaPlayer1.Volume=-1599">小</span>
<span style="cursor:hand" onClick="addVolume(100);">加大音量</span> <span style="cursor:hand" onClick="addVolume(-100);">减少音量</span>
<span style="cursor:hand" onClick="alert(document.MediaPlayer1.Volume);">查看</span>
<br>
<b>播放界面控制</b><br>
<span style="cursor:hand" onClick="document.MediaPlayer1.ShowCaptioning=exchangeValue(document.MediaPlayer1.ShowCaptioning);">显示/隐藏字幕</span>
<span style="cursor:hand" onClick="alert(document.MediaPlayer1.ShowCaptioning);">查看</span>
<br>
<span style="cursor:hand" onClick="document.MediaPlayer1.ShowControls=exchangeValue(document.MediaPlayer1.ShowControls);">显示/隐藏播放控制</span>
<span style="cursor:hand" onClick="alert(document.MediaPlayer1.ShowControls);">查看</span>
<br>
<span style="cursor:hand" onClick="document.MediaPlayer1.ShowAudioControls=exchangeValue(document.MediaPlayer1.ShowAudioControls);">显示/隐藏音量控制</span>
<span style="cursor:hand" onClick="alert(document.MediaPlayer1.ShowAudioControls);">查看</span>
<br>
<span style="cursor:hand" onClick="document.MediaPlayer1.ShowDisplay=exchangeValue(document.MediaPlayer1.ShowDisplay);">显示/隐藏节日信息</span>
<span style="cursor:hand" onClick="alert(document.MediaPlayer1.ShowDisplay);">查看</span>
<br>
<span style="cursor:hand" onClick="document.MediaPlayer1.ShowGotoBar=exchangeValue(document.MediaPlayer1.ShowGotoBar);">显示/隐藏GOTOBAR</span>
<span style="cursor:hand" onClick="alert(document.MediaPlayer1.ShowGotoBar);">查看</span>
<br>
<span style="cursor:hand" onClick="document.MediaPlayer1.ShowPositionControls=exchangeValue(document.MediaPlayer1.ShowPositionControls);">显示/隐藏位置控制</span>
<span style="cursor:hand" onClick="alert(document.MediaPlayer1.ShowPositionControls);">查看</span>
<br>
<span style="cursor:hand" onClick="document.MediaPlayer1.ShowStatusBar=exchangeValue(document.MediaPlayer1.ShowStatusBar);">显示/隐藏播放信息</span>
<span style="cursor:hand" onClick="alert(document.MediaPlayer1.ShowStatusBar);">查看</span>
<br>
<span style="cursor:hand" onClick="document.MediaPlayer1.ShowTracker=exchangeValue(document.MediaPlayer1.ShowTracker);">显示/隐藏播放跟踪条</span>
<span style="cursor:hand" onClick="alert(document.MediaPlayer1.ShowTracker);">查看</span>
<br>
<b>声道切换</b> <span style="cursor:hand" onClick="document.MediaPlayer1.Balance=-9640;">左声道</span>
<span style="cursor:hand" onClick="document.MediaPlayer1.Balance=9640;">右声道</span>
<span style="cursor:hand" onClick="document.MediaPlayer1.Balance=0;">左右平衡</span>
<span style="cursor:hand" onClick="alert(document.MediaPlayer1.Balance);">查看</span>
<br>
<b>视频窗口大小</b> <span style="cursor:hand" onClick="document.MediaPlayer1.DisplaySize=1;">50%</span>
<span style="cursor:hand" onClick="document.MediaPlayer1.DisplaySize=0;">100%</span>
<span style="cursor:hand" onClick="document.MediaPlayer1.DisplaySize=2;">200%</span>
<span style="cursor:hand" onClick="document.MediaPlayer1.DisplaySize=3;">全屏</span>
<span style="cursor:hand" onClick="alert(document.MediaPlayer1.DisplaySize);">查看</span>
<br>
<b>播放进度控制</b> <span style="cursor:hand" onClick="document.MediaPlayer1.CurrentPosition=0;">回到开始</span>
<span style="cursor:hand" onClick="addCurrentPosition(60);">前进一分钟</span>
<span style="cursor:hand" onClick="addCurrentPosition(-60);">后退一分钟</span>
<span style="cursor:hand" onClick="document.MediaPlayer1.CurrentPosition=99999;">到最后</span>
<span style="cursor:hand" onClick="alert(document.MediaPlayer1.CurrentPosition);">查看</span>
<br>
<b>选择伴音</b> <span style="cursor:hand" onClick="document.MediaPlayer1.SAMIFileName='http://xxzx.wems.net/jxggtd/wems-kj/kjk/yw3/1.MP3';">天之痕</span>
<span style="cursor:hand" onClick="document.MediaPlayer1.SAMIFileName='';">无</span>
<span style="cursor:hand" onClick="alert(document.MediaPlayer1.SAMIFileName);">查看</span>
(注意不能马上生效,点击后需要再重新播放歌曲) <span style="cursor:hand" onClick="alert(document.MediaPlayer1.maxlength);">查看</span>
<script language=vbscript>
for each obj in document.MediaPlayer1.all
messagebox(obj)
next
</script>
</td></tr></table>