比較吃力的地方是drop到播放列表，查MSDN查了n久，還有Window Media Player 6.x插件的play有些奇怪，所以我的代碼也有些奇怪........
拜托各位多測測，有Bug您說話，看我做的也挺不容易的，覺得好的您也多捧捧場。
<html>
<head>
<title>My HTML Player</title>
<style>
body {
overflow:auto;
font-size:12px;
cursor:default;
}
#table01 {
font-size:12px;
background-Color:black;
color:white;
text-align:center;
}
#playListTitle {
background-Color:#001122;
color:white;
font-size:12px;
font-weight:bold;
width:100%;
height:16px;
padding:2px;
}
#playList {
width:150px;
height:225px;
margin:0px;
font-size:12px;
background-Color:black;
color:white;
}
#musicList {
width:200px;
border:buttonface 4px groove;
height:80px;
position:absolute;
right:5px;
top:5px;
}
#musicListTitle {
font-size:13px;
width:100%;
height:20px;
background-Color:#C5FFC5;
padding:3px;
font-weight:bold;
}
#musicList a {
text-decoration:none;
width:100%;
height:20px;
line-height:20px;
font-szie:20px;
line-height:20px;
padding-top:5px;
padding-left:10px;
}
#musicList a:hover {
background-Color:#E5FFE5;
}
</style>
<script>
function playList_dragOver(){
event.returnValue=false;
}
function playList_dragEnter(){
event.returnValue=false;
event.dataTransfer.dropEffect='link';
}
function addMusic(){
if(event.srcElement.tagName=='A'){
strTxt=event.srcElement.innerText;
strURL=event.srcElement.href;
playList.innerHTML="";
playList.options[0]=new Option(strTxt,strURL);
playList.options[0].selected=true;
}
event.returnValue=false;
playList_dblClick();
return(false);
}
function playList_drop(){
strTxt=unescape(event.dataTransfer.getData('Text').split(":")[0]);
strURL=unescape(event.dataTransfer.getData('Text').split(":")[1]);
playList.options[playList.options.length]=new Option(strTxt,strURL);
}
function playList_keyDown(){
if(event.keyCode==46){
try{
playList.options[playList.options.selectedIndex].outerHTML="";
}catch(e){}
return(false);
}
if(event.keyCode==13){
playList_dblClick();
return(false);
}
}
function playList_dblClick(){
MediaPlayer1.detachEvent("PlayStateChange",checkPlayStatus);
MediaPlayer1.fileName=playList.value;
MediaPlayer1.play();
setTimeout('MediaPlayer1.play();MediaPlayer1.attachEvent("PlayStateChange",checkPlayStatus);',1000);
}
function musicList_dragStart(){
if(event.srcElement.tagName=='A'){
event.dataTransfer.setData('Text',escape(event.srcElement.innerText)+":"+escape(event.srcElement.href));
}else{
return(false);
}
}
function init(){
MediaPlayer1.AutoRewind=false;
MediaPlayer1.AutoStart=true;
MediaPlayer1.SendPlayStateChangeEvents=true;
MediaPlayer1.attachEvent("PlayStateChange",checkPlayStatus);
}
function checkPlayStatus(oldState,newState){
try{
if(MediaPlayer1.PlayState==0){
MediaPlayer1.detachEvent("PlayStateChange",checkPlayStatus);
MediaPlayer1.stop();
if(playList.options.selectedIndex<playList.options.length-1){
playList.options[playList.options.selectedIndex+1].selected=true;
}else{
playList.options[0].selected=true;
}
MediaPlayer1.fileName=playList.value;
MediaPlayer1.play();
setTimeout('MediaPlayer1.play();MediaPlayer1.attachEvent("PlayStateChange",checkPlayStatus);',1000);
}
}catch(e){}
}
</script>
<body onload="init();">
<table id=table01>
<tr>
<td>
<object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95" id="MediaPlayer1" width="286" height="225" STANDBY="Loading Windows Media Player components..." TYPE="application/x-oleobject">
<param name="AudioStream" value="-1">
<param name="AutoSize" value="-1">
<!--是否自動調整播放大小-->
<param name="AutoStart" value="0">
<!--是否自動播放-->
<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="" 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>
</td>
<td>
<div id=playListTitle>Play List:</div>
<select id=playList size=2 ondragover="playList_dragOver();" ondragenter="playList_dragEnter();"
ondrop="playList_drop();" onkeydown="playList_keyDown();" ondblclick="playList_dblClick();">
</select>
</td>
</tr>
</table>
<div id=musicList ondragstart="musicList_dragStart();">
<div id=musicListTitle>All Music</div>
<a href="
<a href="
<a href="
<a href="
<hr> Tips: 把歌曲拖入播放列表 </div> <div id=info></div> <body> </html> 更多信息請查看IT技術專欄
版權所有:易賢網
公眾號
事業單位
當前位置：
公考類
招聘類
各類考試