使用ＪａｖａＳｃｒｉｐｔ控制網(wǎng)頁嵌入Ｗｉｎｄｏｗｓ Ｍｅｄｉａ Ｐｌａｙｅｒ播放器

摘要：本文介紹了網(wǎng)頁嵌入Windows Media Player播放器以及基本參數(shù)，并且介紹如何使用JavaScipt進(jìn)行Windows Media Player播放器基本播放控制和播放列表添加的方法。

關(guān)鍵詞：網(wǎng)頁；JavaScipt；Windows Media Player

中圖分類號：TP37文獻(xiàn)標(biāo)識碼：A文章編號：1009-3044(2008)04-10ppp-0c

Basic Control of Windows Media Player Embedded in Web Pages with JavaScipt

SHEN Yu-bao1，2

(1. Hefei University of Technology， Hefei 230009， China; 2.Hefei Nursery Teachers Training School， Hefei 230011， China)

Abstract: This paper introduces a web page embedded in the Windows Media Player， as well as basic parameters， and how to use JavaScipt to the Windows Media Player for basic playback controls and playlists Add method.

Key words: Web; JavaScipt; Windows Media Player

1 網(wǎng)頁嵌入Windows Media Player播放器

1.1 網(wǎng)頁播放技術(shù)簡介

“網(wǎng)頁播放器，就是在網(wǎng)頁上實現(xiàn)播放流媒體或本地媒體的一種應(yīng)用。制作網(wǎng)頁播放器，并不是真的在網(wǎng)頁上“發(fā)明”了一種或幾種播放器。目前所有的網(wǎng)頁播放器基本上仍然都是用戶本地的 Windows Media Player（簡稱 WMP）和 Real Player 在發(fā)揮實質(zhì)作用。

1.2 網(wǎng)頁播放技術(shù)原理

所謂網(wǎng)頁播放技術(shù)，就是以網(wǎng)頁代碼的形式利用 WMP（Windows Media Player）或 Real 播放器本身的一些函數(shù)、事件和方法，如暫停、快進(jìn)、全屏等等，在網(wǎng)頁上實現(xiàn)對媒體文件的一種播放控制。網(wǎng)頁播放器功能的多少，取決于對這些函數(shù)、事件和方法利用的多少。好的網(wǎng)頁播放器就好像把真的WMP（Windows Media Player）或 Real 搬到了網(wǎng)頁上一樣，原因就是這種網(wǎng)頁播放器將用戶本地的WMP（Windows Media Player）或 Real 進(jìn)行了淋漓盡致地控制。

1.3 網(wǎng)頁播放器的分類。

在如今的互連網(wǎng)上網(wǎng)頁播放器的表現(xiàn)形式大致有三大類：

簡單型，特點是功能簡單，單曲播放。簡單型不需要什么復(fù)雜的代碼與語言，BBS慣用的 UBB 代碼中的媒體播放就屬于此類。

擴(kuò)展型，特點是功能齊全、美觀大方、能夠連續(xù)播放。擴(kuò)展型均綜合運用了JavaScript或VbScript語言來進(jìn)行網(wǎng)頁上的播放控制。

Flash的SWF文件格式。

還有一類還有一種少見的，那就是在網(wǎng)頁上實現(xiàn)對Winamp的播放控制，原理跟上面的講述是一致的。 “簡單型網(wǎng)頁播放器方法與應(yīng)用”分含彈出式窗口網(wǎng)頁播放器制作等。“擴(kuò)展型網(wǎng)頁播放器方法與應(yīng)用”分含論壇內(nèi)嵌播放器等。

1.4 WindowsMediaPlayer網(wǎng)頁播放器相關(guān)部分參數(shù)及含義

WindowsMediaPlayer 控件在編程時經(jīng)常要用到，以下以WindowsMediaPlayer 9.0控件為例。列舉一些常用屬性及方法，假設(shè)此控件名為player。見表1：

1.5 Windows Media Player 網(wǎng)頁播放器簡單代碼

Windows Media Player 9

2 使用JavaScipt對播放器界面及簡單控制

效果圖如圖1：

圖1

部分代碼如下：

// JavaScript Document for SimpleControl.js

var state;

//初始化

function playerinit()

{

player.settings.autoStart = true ;

}

//播放

function play()

{

if (player.controls.isavailable('play'))

{

player.controls.play();

state=setInterval(\"updatetime()\"，1000);

playerinfo.innerHTML = \"播放\";

//顯示媒體藝術(shù)家和媒體標(biāo)題

var str1=player.currentMedia.getItemInfo(\"Author\")+player.currentMedia.getItemInfo(\"Title\");

singerinfo.innerHTML= str1;

}

}

//暫停

function pause()

{

if (player.controls.isavailable('pause')) //isavailable() 返回命令當(dāng)前是否已啟用

{ player.controls.pause();

clearInterval(state);

playerinfo.innerHTML = \"暫停\";

}

}

//停止

function stop()

{ if (player.controls.isavailable('stop'))

{ player.controls.stop();

clearInterval(state);

playerinfo.innerHTML = \"停止\";

}

}

//前首

function previous()

{

if (player.controls.isavailable('previous'))

{

player.controls.previous();

playerinfo.innerHTML = \"前一首\";

}

}

//后首

function next()

{

if (player.controls.isavailable('next'))

{

player.controls.next();

playerinfo.innerHTML = \"下一首\";

}

}

//音量

function volumedown()

{

if (player.settings.volume < 10)

{

player.settings.volume = 0;

playerinfo.innerHTML = \"0\";

}

else

{

player.settings.volume -= 10;

playerinfo.innerHTML = player.settings.volume;

}

}

//音量+

function volumeup()

{

if (player.settings.volume > 95)

{

player.settings.volume = 100;

playerinfo.innerHTML = \"100\";

}

else

{

player.settings.volume += 10;

playerinfo.innerHTML = player.settings.volume;

}

}

//靜音

function mute()

{

player.settings.mute = !player.settings.mute;

//vmute.src=

}

//聲道控制

function balance()

{

switch (player.settings.balance)

{

case 0:

player.settings.balance = 100;

playerinfo.innerHTML = '左聲道';

break;

case 100:

player.settings.balance = -100;

playerinfo.innerHTML = '右聲道';

break;

case -100:

player.settings.balance = 0;

playerinfo.innerHTML = '全聲道';

break;

default :

player.settings.balance = 0;

playerinfo.innerHTML = '全聲道';

break;

}

}

//更新時間

function updatetime()

{

playerinfo.innerHTML = player.controls.currentPositionString + \" | \" + player.currentMedia.durationString;

}

3 使用JavaScipt控制播放列表簡單控制，部分代碼如下：

// JavaScript Document for AddMediaToList.js

// 全選

function selectall()

{

var selectAll = document.getElementsByName(\"song\");

if (selectAll!=1){

for (var i=0;i

selectAll[i].checked = true;

}

}

}//end of selectall

//反選

function unselect()

{

var unselect = document.getElementsByName(\"song\");

if (unselect!=1){

for (var i=0;i

if (unselect[i].checked==true) {unselect[i].checked = 1;}

else{ unselect[i].checked =true;}

}

}

} //end of unselect

function addmedia(url)

{

// 取得當(dāng)前的播放列表

var playlist=player.currentPlaylist;//新建一個指定URL的Media。

var currMedia = player.newMedia(url);

//把新建的Media item添加到播放器列表

playlist.appendItem(currMedia);

} //end of addmedia

//清空播放列表

function clearlist()

{

//Player.currentPlaylist.count返回列表中的歌曲數(shù)量

while (player.currentPlaylist.count>0) {

var item =player.currentPlaylist.item(player.currentPlaylist.count-1);

player.currentPlaylist.removeItem(item); //從播放列表中刪除項

}

} //end of clearlist

//播放選中的歌曲

function addSeletedSongToPlayList()

{

clearlist()

var selectItem = document.getElementsByName(\"song\");

// alert(selectItem.length);

for(var i=0;i

{

if (selectItem[i].checked==true)

{

addmedia(selectItem[i].value);

}

}

if (player.currentPlaylist.count==0) alert(\"至少要選擇一首歌曲\");

player.controls.play(); //讓播放器開始播放

} //添加文本輸入框中的url到播放列表

functionaddUrlToList(){

addmedia(document.getElementById(\"song_url\").value );

//添加一行

var newTr = table1.insertRow();

//添加兩列

var newTd0 = newTr.insertCell();

var newTd1 = newTr.insertCell();

newTd0.innerHTML='';

newTd1.innerHTML= document.getElementById(\"song_name\").value;

//設(shè)定新添加的復(fù)選框的值

}//end of addUrlToList

4 代碼總結(jié)

本文只是通過JavaScipt語言簡單控制網(wǎng)頁嵌入Windows Media Player播放器、在實際開發(fā)中，可以充分利用JavaScipt強大功能以及web開發(fā)語言和數(shù)據(jù)庫實現(xiàn)個性化音樂網(wǎng)站的建設(shè)。使用JavaScipt語言可以更高級的功能、如支持lrc歌詞等、迷你歌詞、千千靜聽、酷狗等播放器就是很好得成功范例。在本例中，嚴(yán)格進(jìn)行ActionScript變量定義和引用，使的設(shè)計思路明確，希望本例能夠?qū)Τ浞职l(fā)揮網(wǎng)頁播放器挖掘和應(yīng)用方面具有積極的意義。

參考文獻(xiàn)：

[1]Michael Moncur. JavaScipt入門經(jīng)典[M]. 人民郵電出版社，2007.

[2]廖勇，周德松. 流媒體技術(shù)入門與提高[M]. 國防工業(yè)出版社，2006.

作者簡介：沈玉寶（1978-），男，安徽滁州人，合肥幼師現(xiàn)教中心講師。