您的位置:首页 > Web前端 > JavaScript

Javascript访问windowMediaPlayer编写的播放功能(简单示范)

2010-04-13 18:06 435 查看
参考了网上别人的代码.总是有一些简单问题.编写了个示例,一下是通过测试成功的代码:

一、Head里面的JS脚本

<mce:script type="text/javascript"><!--

//保存当前播放曲目在列表中的索引
var index = 0;
//var timer = null;
function $(oid){
return document.getElementById(oid);
}

//下一首
function next(){
if (index<$('playList').options.length-1){
index++;
$('wmp').URL=$('playList').options[index].value;
$('playList').selectedIndex=index;
}
}

//上一首
function pre(){
if (index>0){
index--;
$('wmp').URL=$('playList').options[index].value;
$('playList').selectedIndex=index;
}
}

//检查播放器的状态
//function checkState(){

//	if ($('wmp').playState==1){
//		next();
//	}
//	window.setTimeout("checkState()",2000);
//}

//当浏览器加载完毕之后播放列表里面的第一首歌曲
window.onload=function(){
$('wmp').URL=$('playList').value;
$('playList').selectedIndex=index;

//设置一个定时器,检测播放器的状态
//window.setTimeout("checkState()",2000);
}

//快进
function Forward(){
$('wmp').controls.fastForward();
}

//快退,无法使用
function reverse(){
$('wmp').controls.fastReverse();
}

// --></mce:script>


二、Html脚本

<body>
<table>
<tr>
<td>
<object classid="clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6" id="wmp">

<!-- 媒体文件地址 -->

<param name="rate" value="1" />
<param name="balance" value="0" />
<!--声道0全声道,-100左声道,100右声道-->
<param name="currentPosition" value="0" />
<param name="playCount" value="1" />
<!--播放次数-->
<param name="autoStart" value="-1" />
<!--是否自动播放-1是,0否-->
<param name="currentMarker" value="0" />
<param name="invokeURLs" value="-1" />
<param name="volume" value="50" />
<!--音量-->
<param name="mute" value="0" />
<!--是否静音-1是,0否-->
<param name="uiMode" value="full" />
<!--播放器模式full(默认)显示全部控件,none仅视频窗口,mini视频及一些常用控件,invisiblei不显示任何控件及视频窗口-->
<param name="stretchToFit" value="0" />
<param name="windowlessVideo" value="0" />
<param name="enabled" value="-1" />

<param name="no_enableContextMenu" value="-1" />
<param name="fullScreen" value="0" />
<!--是否全屏-->
<param name="enableErrorDialogs" value="-1" />
<!--是否允许出错信息提示-->
</object>
</td>
<td>
<fieldset title="播放列表"  style="height:230px;">
<span style="color:orange;font-size:12px;" mce_style="color:orange;font-size:12px;">播放列表</span><br/>

<select size="6" id="playList" style="height:200px;width:200px;" ondblclick="$('wmp').URL=this.value;index=this.selectedIndex;">
<option value="mp3/2.mp3" selected="selected">歌曲一</option>
<option value="mp3/3.mp3">歌曲二</option>
<option value="mp3/4.mp3">歌曲三</option>
<option value="mp3/rememberwhen.mp3">歌曲四</option>
</select>
</fieldset>
</td>
</tr>
</table>

<hr/>
<input style="width:81px;" type="button" value="开始" onclick="wmp.controls.play();"/>

<input  style="width:81px;" type="button" value="暂停" onclick="wmp.controls.pause();"/>

<input  style="width:81px;"type="button" value="停止" onclick="wmp.controls.stop();"/>

<input  style="width:81px;" type="button" value="+" onclick="if ($('wmp').settings.volume<=100){$('wmp').settings.volume+=10;}" />
调节音量
<input  style="width:81px;" type="button" value="-" onclick="if ($('wmp').settings.volume>0){$('wmp').settings.volume-=10;}"/>

<p></p>
<input  style="width:81px;"type="button" value="上一首" onclick="pre();"/>

<input  style="width:81px;"type="button" value="下一首" onclick="next();"/>

<input  style="width:81px;"type="button" value="快进" onclick="Forward();"/>

<!-- 播放器模式full(默认)显示全部控件,none仅视频窗口,mini视频及一些常用控件,invisiblei不显示任何控件及视频窗口 -->
显示模式:
<select onchange="$('wmp').uiMode=this.value;">
<option value="full">全部</option>
<option value="none">仅视频</option>
<option value="mini">常用</option>
<option value="invisible">隐藏</option>
</select>
</body>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: