js控制MediaPlayer播放器

其实用js来做一个音乐播放器很容易,因为mediaplayer提供了一系列的接口来对网页嵌入的播放器进行控制。下面简单的介绍一下:

在网页内插入播放器的代码为:

<object id="player" height="64" width="260" classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6">
<param NAME="AutoStart" VALUE="-1">
<!--是否自动播放-->
<param NAME="Balance" VALUE="0">
<!--调整左右声道平衡,同上面旧播放器代码-->
<param name="enabled" value="-1">
<!--播放器是否可人为控制-->
<param NAME="EnableContextMenu" VALUE="-1">
<!--是否启用上下文菜单-->
<param NAME="url" value="/blog/1.wma">
<!--播放的文件地址-->
<param NAME="PlayCount" VALUE="1">
<!--播放次数控制,为整数-->
<param name="rate" value="1">
<!--播放速率控制,1为正常,允许小数,1.0-2.0-->
<param name="currentPosition" value="0">
<!--控件设置:当前位置-->
<param name="currentMarker" value="0">
<!--控件设置:当前标记-->
<param name="defaultFrame" value="">
<!--显示默认框架-->
<param name="invokeURLs" value="0">
<!--脚本命令设置:是否调用URL-->
<param name="baseURL" value="">
<!--脚本命令设置:被调用的URL-->
<param name="stretchToFit" value="0">
<!--是否按比例伸展-->
<param name="volume" value="50">
<!--默认声音大小0%-100%,50则为50%-->
<param name="mute" value="0">
<!--是否静音-->
<param name="uiMode" value="mini">
<!--播放器显示模式:Full显示全部;mini最简化;None不显示播放控制,只显示视频窗口;invisible全部不显示-->
<param name="windowlessVideo" value="0">
<!--如果是0可以允许全屏,否则只能在窗口中查看-->
<param name="fullScreen" value="0">
<!--开始播放是否自动全屏-->
<param name="enableErrorDialogs" value="-1">
<!--是否启用错误提示报告-->
<param name="SAMIStyle" value>
<!--SAMI样式-->
<param name="SAMILang" value>
<!--SAMI语言-->
<param name="SAMIFilename" value>
<!--字幕ID-->
</object>

下面是一些常用的方法和属性:

//基本属性
URL:String; 指定媒体位置,本机或网络地址
uiMode:String; 播放器界面模式,可为Full, Mini, None, Invisible
playState:integer; 播放状态,1=停止,2=暂停,3=播放,6=正在缓冲,9=正在连接,10=准备就绪
enableContextMenu:Boolean; 启用/禁用右键菜单(也是简单的防盗链方法)
fullScreen:boolean; 是否全屏显示

//播放器控制属性
controls.play; 播放
controls.pause; 暂停
controls.stop; 停止
controls.currentPosition:double; 当前进度
controls.currentPositionString:string; 当前进度,字符串格式。如“00:23”
controls.fastForward; 快进
controls.fastReverse; 快退
controls.next; 下一曲
controls.previous; 上一曲
*注: 上一曲和下一曲属性一般不能使用,因为这种功能是对一个播放列表气作用的,而对于新版本的播放器,js脚本一般没有权限去新建和修改播放列表的。只能自己去设计一个播放列表,自己去修改url属性去选曲。

//播放器基本属性
settings.volume:integer; 音量,0-100
settings.autoStart:Boolean; 是否自动播放
settings.mute:Boolean; 是否静音
settings.playCount:integer; 播放次数

//当前播放媒体的属性
currentMedia.duration:double; 媒体总长度
currentMedia.durationString:string; 媒体总长度,字符串格式。如“03:24”
currentMedia.getItemInfo(const string); 获取当前媒体信息"Title"=媒体标题,"Author"=艺术家,"Copyright"=版权信息,"Description"=媒体内容描述,"Duration"=持续时间(秒),"FileSize"=文件大小,"FileType"=文件类型,"sourceURL"=原始地址
currentMedia.setItemInfo(const string); 通过属性名设置媒体信息
currentMedia.name:string; 同 currentMedia.getItemInfo("Title")
[currentPlaylist] wmp.currentPlaylist //当前播放列表属性
currentPlaylist.count:integer; 当前播放列表所包含媒体数
currentPlaylist.Item[integer]; 获取或设置指定项目媒体信息,其子属性同wmp.currentMedia

//最后是一些很少用到的参数和属性
AllowChangeDisplaySize 返回或设置最终用户是否能设置显示尺寸(逻辑型)
AllowScan 返回或设置是否允许扫描(逻辑型)
AnimationAtStart 返回或设置控件开始播放之前是否先播放一个动画序列(逻辑型)
AudioStream 返回或设置音频流的编号(用于多音频流的剪辑,默认为-1)(长整型)
AutoRewind 返回或设置媒体文件播放完毕后是否自动回绕(逻辑型)
AutoSize 返回或设置是否自动调整控件大小来适应载入的媒体(逻辑型)
AutoStart 返回或设置在载入媒体文件之后是否自动开始播放(逻辑型)
Balance 返回或设置指定立体声媒体文件的播放声道(-10000为左声道,10000为右声道,0为立体声)(长整型)
Bandwidth 返回或设置当前文件的带宽(长整型)
BaseURL 返回基本的 HTTP URL(字符串)
BufferingCount 返回媒体文件回放时缓冲的总时间(长整型)
BufferingProgress 返回缓冲完成的百分比(长整型)
BufferingTime 返回缓冲的时间(双精度型)
CanPreview 返回或设置当前显示的剪辑是能否被预览(逻辑型)
CanScan 返回或设置当前文件是否支持快进或快退(逻辑型)
CanSeek 返回或设置当前文件是否能搜索并定位到某个时间(逻辑型)
CanSeekToMarkers 返回或设置文件是否支持搜索到标签(逻辑型)
CaptioningID 返回在标题中显示的帧或控件的名称(字符串)
ChannelDescription 返回电台的描述(字符串)
ChannelName 返回电台的名称(字符串)
ChannelURL 返回电台的元文件的位置(字符串)
ClickToPlay 返回或设置是否可以通过点击图像暂停或播放剪辑(逻辑型)
ClientID 返回客户端唯一的标识符(字符串)
CodecCount 返回文件使用的可安装的 codecs 的个数(长整型)
ContactAddress 返回电台的联系地址(字符串)
ContactEmail 返回电台的联系电子邮件地址(字符串)
ContactPhone 返回电台的联系电话(字符串)
CreationDate 返回剪辑的创建日期(日期型)
CurrentMarker 返回或设置当前书签号码(长整型)
CurrentPosition 返回或设置剪辑的当前位置(双精度型)
CursorType 返回或设置指针类型(长整型)
DefaultFrame 返回或设置控件的默认目标 Http 帧(字符串)
DisplayBackColor 返回或设置显示面板的背景色(OLE_COLOR 值)
DisplayForeColor 返回或设置显示面板的前景色(OLE_COLOR 值)
DisplayMode 返回或设置显示面板是否用秒或帧的形式显示当前位置(MPDisplayModeConstants 值)
DisplaySize 返回或设置图像显示窗口的大小(MPDisplaySizeConstant 值)
Duration 返回或设置剪辑剪辑的播放时间(双精度型)
EnableContextMenu 返回或设置是否允许使用上下文菜单(逻辑型)
Enabled 返回或设置控件是否可用(逻辑型)
EnableFullScreenControls 返回或设置全屏幕控制是否可用(逻辑型)
EnablePositionControls 返回或设置位置控制是否可用(逻辑型)
EnableTracker 返回或设置搜索栏控制是否可用(逻辑型)
ErrorCode 返回当前错误代码(长整型)
ErrorCorrection 返回当前剪辑的错误修正类型(长整型)
ErrorDescription 返回当前错误的描述(字符串)
FileName 返回或设置要播放的剪辑的文件名称(字符串)
HasError 返回控件是否发生错误(逻辑型)
HasMultipleItems 返回或设置控件是否包含某些多重项目的内容(逻辑型)
ImageSourceHeight 返回或设置当前剪辑的原始图像高度(长整型)
ImageSourceWidth 返回或设置当前剪辑的原始图像宽度(长整型)
InvokeURLs 返回或设置 URL 是否自动发送请求(逻辑型)
IsBroadcast 返回或设置源是否进行广播(逻辑型)
IsDurationValid 返回或设置持续时间值是否有效(逻辑型)
Language 返回或设置用于本地化语言支持的当前区域语言(长整型)
LostPackets 返回丢失的数据包数量(长整型)
MarkerCount 返回文件书签的数量(长整型)
Mute 返回或设置控件是否播放声音(逻辑型)
OpenState 返回控件的内容源状态(长整型)
PlayCount 返回或设置一个剪辑播放的次数(长整型)
PlayState 返回控件的当前操作状态(长整型)
PreviewMode 返回或设置控件是否处在预览模式(逻辑型)
Rate 返回或设置回放帧频(双精度型)
ReadyState 返回控件是否准备就绪(ReadyStateConstant 值)
ReceivedPackets 返回已接收到的数据包的数量(长整型)
ReceptionQuality 返回最后 30 秒接收到的数据包的百分比(长整型)
RecoveredPackets 返回已转换的数据包的数量(长整型)
SAMIFileName 返回或设置 closed-captioning 文件名(字符串)
SAMILang 返回或设置 closed captioning 语言(字符串)
SAMIStyle 返回或设置 closed captioning 风格(字符串)
SelectionEnd 返回或设置流的结束位置(双精度型)
SelectionStart 返回或设置流的起始位置(双精度型)
SendErrorEvents 返回或设置控件是否发送错误事件(逻辑型)
SendKeyboardEvents 返回或设置控件是否发送键盘事件(逻辑型)
SendMouseClickEvents 返回或设置控件是否发送鼠标单击事件(逻辑型)
SendMouseMoveEvents 返回或设置控件是否发送鼠标移动事件(逻辑型)
SendOpenStateChangeEvents 返回或设置控件是否发送打开状态改变事件(逻辑型)
SendPlayStateChangeEvents 返回或设置控件是否发送播放状态改变事件(逻辑型)
SendWarningEvents 返回或设置控件是否发送警告事件(逻辑型)
ShowAudioControls 返回或设置是否显示音频控制(逻辑型)
ShowCaptioning 返回或设置是否显示字幕(逻辑型)
ShowControls 返回或设置控制面板是否可见(逻辑型)
ShowDisplay 返回或设置是否显示显示面板(逻辑型)
ShowGotoBar 返回或设置是否显示跳转栏(逻辑型)
ShowPositionControls 返回或设置是否显示位置控制(逻辑型)
ShowStatusBar 返回或设置是否显示状态栏(逻辑型)
ShowTracker 返回或设置是否显示搜索栏(逻辑型)
SourceLink 返回内容文件的路径(字符串)
SourceProtocol 返回用于接收数据的协议(长整型)
StreamCount 返回媒体帧的数量(长整型)
TransparentAtStart 返回或设置在开始播放之前和停止之后控件是否透明(逻辑型)
VideoBorder3D 返回或设置视频边框是否显示为 3D 效果(逻辑型)
VideoBorderColor 返回或设置视频边框的颜色(OLE_颜色)
VideoBorderWidth 返回或设置视频边框的宽度(长整型)
Volume 返回或设置音量(长整型)

---------------更新部分

embed标签用法

embed
(一)、基本语法:
embed src=url
说明: embed可以用来插入各种多媒体,格式可以是 Midi、Wav、AIFF、AU、MP3等等,
Netscape及新版的IE 都支持。url为音频或视频文件及其路径,可以是相对路径或绝对路径。
示例: <embed src="your.mid">

(二)、属性设置:
1、自动播放:
语法: autostart=true、false
说明: 该属性规定音频或视频文件是否在下载完之后就自动播放。
true: 音乐文件在下载完之后自动播放;
false: 音乐文件在下载完之后不自动播放。
示例: <embed src="your.mid" autostart=true>
<embed src="your.mid" autostart=false>

2、循环播放:
语法: loop=正整数、true、false
说明: 该属性规定音频或视频文件是否循环及循环次数。
属性值为正整数值时,音频或视频文件的循环次数与正整数值相同;
属性值为true时,音频或视频文件循环;
属性值为false时,音频或视频文件不循环。
示例: <embed src="your.mid" autostart=true loop=2>
<embed src="your.mid" autostart=true loop=true>
<embed src="your.mid" autostart=true loop=false>

3、面板显示:
语法: hidden=ture、no
说明: 该属性规定控制面板是否显示,默认值为no。
ture: 隐藏面板;
no: 显示面板。
示例: <embed src="your.mid" hidden=ture>
 <embed src="your.mid" hidden=no>

  4、开始时间:
语法: starttime=mm:ss(分: 秒)
说明: 该属性规定音频或视频文件开始播放的时间。未定义则从文件开头播放。
示例: <embed src="your.mid" starttime="00:10">

  5、音量大小:
语法: volume=0-100之间的整数
说明: 该属性规定音频或视频文件的音量大小。未定义则使用系统本身的设定。
示例: <embed src="your.mid" volume="10">

  6、容器属性:
语法: height=# width=#
说明: 取值为正整数或百分数,单位为像素。该属性规定控制面板的高度和宽度。
height: 控制面板的高度;
width: 控制面板的宽度。
示例: <embed src="your.mid" height=200 width=200>

  7、容器单位:
语法: units=pixels、en
说明: 该属性指定高和宽的单位为pixels或en。
示例: <embed src="your.mid" units="pixels" height=200 width=200>
<embed src="your.mid" units="en" height=200 width=200>

  8、外观设置:
语法: controls=console、smallconsole、playbutton、pausebutton、stopbutton、
volumelever 说明: 该属性规定控制面板的外观。默认值是console。
console: 一般正常面板;
smallconsole: 较小的面板;
playbutton: 只显示播放按钮;
pausebutton: 只显示暂停按钮;
stopbutton: 只显示停止按钮;
volumelever: 只显示音量调节按钮。
示例: <embed src="your.mid" controls=smallconsole>
<embed src="your.mid" controls=volumelever>

  9、对象名称:
语法: name=#
说明: #为对象的名称。该属性给对象取名,以便其他对象利用。
示例: <embed src="your.mid" name="sound1">

  10、说明文字:
语法: title=#
说明: #为说明的文字。该属性规定音频或视频文件的说明文字。
示例: <embed src="your.mid" title="第一首歌">

  11、前景色和背景色:
语法: palette=color|color
说明: 该属性表示嵌入的音频或视频文件的前景色和背景色,第一个值为前景色,第二个值为背景
色,中间用 | 隔开。color可以是RGB色(RRGGBB)也可以是颜色名,还可以是transparent
(透明)。 示例: <embed src="your.mid" palette="red|black">

  12、对齐方式:
语法: align=top、bottom、center、baseline、 left、right、texttop、middle、
absmiddle、absbottom
说明: 该属性规定控制面板和当前行中的对象的对齐方式。
center: 控制面板居中;
left: 控制面板居左;
right: 控制面板居右;
top: 控制面板的顶部与当前行中的最高对象的顶部对齐;
bottom: 控制面板的底部与当前行中的对象的基线对齐;
baseline: 控制面板的底部与文本的基线对齐;
texttop: 控制面板的顶部与当前行中的最高的文字顶部对齐;
middle: 控制面板的中间与当前行的基线对齐;
absmiddle: 控制面板的中间与当前文本或对象的中间对齐;
absbottom: 控制面板的底部与文字的底部对齐。
示例: <embed src="your.mid" align=top>
<embed src="your.mid" align=center>

media player控制

player.controls.play(); 播放
player.controls.stop(); 停止
player.controls.pause(); 暂停
player.controls.currentPosition 返回播放文件的当前时间位置(以秒为单位)
player.controls.currentPositionString 时间格式的字符串 "0:32"
player.currentMedia.duration 返回播放文件的总长度(以秒为单位)
player.currentMedia.durationString 时间格式的字符串 "4:34"
player.settings.volume 音量 (0-100)
player.settings.balance 声道(通过它应该可以进行立体声、左声道、右声道的控制,最左-9640,最右9640。)
player.settings.mute = s 静音(s取值为true和false)
player.closedCaption.CaptioningID 网页中出现字幕的容器的ID
player.closedCaption.SAMIFileName 字幕文件地址
player.playState 返回播放器状态( 3: 正在播放,2: 暂停1: 已停止)

例子:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script>
var music_src = new Array();
music_src[0] = "music/1.mid";
music_src[1] = "music/2.mid";
music_src[2] = "music/3.mid";
music_src[3] = "music/4.mid";
music_src[4] = "music/5.mid";
var array_index = Math.random() * 5;
var music_index = Math.floor(array_index);
function p_music()
{
var starts = wind_meb.playState;
if(starts == 1)
{
music_index++;
alert(music_index);
wind_meb.url = music_src[music_index];
wind_meb.controls.play();
}
timer = setTimeout("p_music()",3000);
}
</script>
</head>
<body onLoad="p_music()">
<object classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6" id="wind_meb">
<param value="1" name="ShowStatusBar">
<param name="url" value="music/1.mid">
</object>
</body>
</html>

======================================================

REAL PLAYER控制

player.DoPlay() 播放
player.DoPause() 暂停
player.DoStop() 停止
player.GetLength() 返回播放文件的总长度(以毫秒为单位)
player.GetPosition() 返回播放文件的当前时间位置(以毫秒为单位)
player.GetPlayState() 返回播放器状态(0:停止,1:连接,2:缓冲,3:播放,4:暂停,5:寻找)
player.SetPosition(n) 时间位置跳到n的地方(n取值以毫秒为单位)
player.SetVolume(n) 设置音量(n取值为0到100)
player.SetMute(s) 静音(s取值为true和false)
player.SetFullScreen() 全屏
player.setSource() 设置文件来源

2 Replies to “js控制MediaPlayer播放器”

  1. Pingback: are potatoes keto

Leave a Reply

Your email address will not be published.