没想过要用这个东西,但群里有人问,这个地址也是群里的朋友贴出来的,仔细想想这个东西也有应用的场景,比如歌词的控制。能够得到播放时间,就能够控制歌词的显示了。估计那些用JS做的播放器大致都是这样的吧?猜测而已 内容如下:http://roln.cn/archives/80 <!–播放器 开始–> <object id=”Exobud” style="”width:" mce_style="”width:" 273px; height: 64px” type=”application/x-oleobject” classid=”CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6″> <param name=”URL” value=”"/> <param name=”rate” value=”1″/> <param name=”balance” value=”0″/> <param name=”currentPosition” value=”0″/> <param name=”defaultFrame” value=”"/> <param name=”playCount” value=”1″/> <param name=”autoStart” value=”-1″/> <param name=”currentMarker” value=”0″/> <param name=”invokeURLs” value=”-1″/> <param name=”baseURL” value=”"/> <param name=”volume” value=”80″/> <param name=”mute” value=”0″/> <param name=”uiMode” value=”full”/> <param name=”stretchToFit” value=”-1″/> <param name=”windowlessVideo” value=”0″/> <param name=”enabled” value=”-1″/> <param name=”enableContextMenu” value=”0″/> <param name=”fullScreen” value=”0″/> <param name=”SAMIStyle” value=”"/> <param name=”SAMILang” value=”"/> <param name=”SAMIFilename” value=”"/> <param name=”captioningID” value=”"/> <param name=”enableErrorDialogs” value=”0″/> <param name=”_cx” value=”7223″/> <param name=”_cy” value=”1693″/> </object> <!–播放器 结束–> 1 单项播放很简单,这里粗略的说一下 通过网页传参在后台cs页面绑定一个变量 html <param name=”URL” value=”<% = Url%>”/> cs public string Url; Url = 从数据库中读取 2 让播放器播放多首歌曲并循环播放呢 思路就是建一个播放列表,然后通过js来控件. 第一种方法 (此方法最终行不通) 建立一个数组相当于播放列表alist(假设这是用户选择歌曲后的结果) js var num = 0 function Onload(){ var Exobud = document.getElementById(”Exobud”); Exobud.URL = alist[num]; Exobud.controls.play(); num ++; } 通过PlayStateChange监听播放状态 ,8表示播放结束 <mce:script for=”Exobud” EVENT=”PlayStateChange(stats)”><!-- if(stats == 8 ) Exobud.URL = alist[num]; Exobud.controls.play(); //alert(Exobud.URL); num ++ // --></mce:script> 到此播放正常,当播放下一首歌的时候就定住了.非要手动去点播放.不知道是何原因? 在网上查,有一仁兄弟好像解决过这问题,说是放第二首歌的时候,仍然是在第一首歌的播放状态下,所以就一直是停的. 解决办法,就是每首歌只播放一次,但不知道改那里.播放器参数中每首歌是设的播放一次. 另一种办法就是加一个alert(Exobud.URL);这样就可以自动播放,但总弄个弹窗不好吧. 到现在还没弄明白是么回事.如有人知道请留言跟贴,帮我解决一哈. 第二种方法.现已解决.能正常使用. 思路就是用setTimeout()不停的循环,然后控件播放列表的索引得到值来改变URL 先建立一个播放列表 假设用户所选的歌曲参数已传过来 播放列表如下 <select name=”SongList” size=”5″ > OnDblClick=”player();”> <option value=”songs/001.mp3″>001</option> <option value=”songs/002.wma”>002</option> <option value=”songs/003.WMV”>003</option> <option value=”songs/004.mp3″>004</option> <option value=”songs/005.wma”>005</option> </select> 同时设置几个按钮 <a href="”#”" mce_href="”#”" οnclick=”javascript:play();”>on</a> <a href="”#”" mce_href="”#”" οnclick=”javascript:Last_OneOK();”>last</a> <a href="”#”" mce_href="”#”" οnclick=”javascript:Next_OneOK();”>next</a> js <mce:script language=”JavaScript”><!-- //var server=’http://localhost/music/’; var SongList = document.getElementById(”SongList”); var Exobud = document.getElementById(”Exobud”); var TotalSongs = SongList.options.length; function play() { SongList.options[0].selected=true; player(); } function player(){ if(SongList.selectedIndex < 0) alert(’系统错误,请选择您要播放的曲目!’); else{ var url; url = SongList.options[SongList.selectedIndex].value; Exobud.URL=url; //alert(TotalSongs); Exobud.controls.play(); showTLab(); return; } } function showTLab(){ if(Exobud.playState == 1) Next_OneOK(); setTimeout(”showTLab()”, 1000); } function Next_OneOK(){ if(SongList.selectedIndex >= 0){ if(SongList.selectedIndex < TotalSongs-1){ SongList.options[SongList.selectedIndex + 1].selected = true; player(); }else{ SongList.options[0].selected = true; player(); } } } function Last_OneOK(){ if((SongList.selectedIndex > 0) && (SongList.selectedIndex < TotalSongs)){ SongList.options[SongList.selectedIndex - 1].selected = true; player(); } } // --></mce:script> 这样问题就解决了. 注音乐文件都是我本地的 附上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 声道,通过它应该可以进行立体声、左声道、右声道的控制。但对应的取值尚不清楚。 player.settings.mute = s 静音(s取值为true和false) player.closedCaption.CaptioningID 网页中出现字幕的容器的ID player.closedCaption.SAMIFileName 字幕文件地址 player.playState 返回播放器状态( 3:正在播放,2:暂停1:已停止) -------------------------------------------------------------------------------- 相关内容: 网页音乐播放器 function get( lyrics ){ var l= lyrics; var reg_soundname =//[ti:(.+?)/]/i; var reg_singer=//[ar:(.+?)/]/i; var reg_CD =//[al:(.+?)/]/i; var reg_maker =//[(by:.+?)/]/i; var arr_soundname = l.match(reg_soundname); var arr_singer = l.match(reg_singer); var arr_CD= l.match(reg_CD); var arr_maker = l.match(reg_maker); var info= " "; if (arr_soundname != null) { info += ":" + arr_soundname[1] + " "; } if (arr_singer != null) { info += ":" + arr_singer[1] + " "; } if (arr_CD != null) { info += ":" + arr_CD[1] + " "; } if (arr_maker != null) { info += arr_maker[1] + " "; } var reg_take =//[/d/d:/d/d/./d/d/]*(/s)*(/S)+/g; // var arr_lyrics = l.match(reg_take); var reg_replacetime =/(/[/d/d:/d/d/./d/d/])+/g; var reg_gettimes =/(/[/d/d:/d/d/./d/d/])/g; var reg_readtime =//[(/d/d):(/d/d/./d/d)/]/; var reg_dis =/ $/; var arr_splitedLyrics = new Array(); var arr_info = [0, info]; arr_splitedLyrics.push(arr_info); for ( ly= 0; ly < arr_lyrics.length; ly++) { var arr_tmptime= arr_lyrics[ly].match(reg_gettimes); // alert("arr_lyrics[ly]="+arr_lyrics[ly]); // alert("arr_tmptime="+arr_tmptime); var lyy = arr_lyrics[ly].replace(reg_replacetime, ""); for ( i= 0; i < arr_tmptime.length; i++) { var arr_single= new Array(); var t = arr_tmptime[i]; // alert("t="+t); var min = t.substring(1,3); var sec = t.substring(4,t.length-1); //alert("sec="+sec); var time = Number(min) * 60 + Number(sec); // alert("time="+time); arr_single[0] = time; // if (!reg_dis.test(lyy)) // { // lyy += " "; // } arr_single[1] = lyy; arr_splitedLyrics.push(arr_single); } arr_splitedLyrics.sort(function(a, b){ return a[0]-b[0]; } ; } return arr_splitedLyrics; } function get( lyrics ){ var l= lyrics; var reg_soundname =//[ti:(.+?)/]/i; var reg_singer=//[ar:(.+?)/]/i; var reg_CD =//[al:(.+?)/]/i; var reg_maker =//[(by:.+?)/]/i; var arr_soundname = l.match(reg_soundname); var arr_singer = l.match(reg_singer); var arr_CD= l.match(reg_CD); var arr_maker = l.match(reg_maker); var info= " "; if (arr_soundname != null) { info += ":" + arr_soundname[1] + " "; } if (arr_singer != null) { info += ":" + arr_singer[1] + " "; } if (arr_CD != null) { info += ":" + arr_CD[1] + " "; } if (arr_maker != null) { info += arr_maker[1] + " "; } var reg_take =//[/d/d:/d/d/./d/d/]*(/s)*(/S)+/g; // var arr_lyrics = l.match(reg_take); var reg_replacetime =/(/[/d/d:/d/d/./d/d/])+/g; var reg_gettimes =/(/[/d/d:/d/d/./d/d/])/g; var reg_readtime =//[(/d/d):(/d/d/./d/d)/]/; var reg_dis =/ $/; var arr_splitedLyrics = new Array(); var arr_info = [0, info]; arr_splitedLyrics.push(arr_info); for ( ly= 0; ly < arr_lyrics.length; ly++) { var arr_tmptime= arr_lyrics[ly].match(reg_gettimes); // alert("arr_lyrics[ly]="+arr_lyrics[ly]); // alert("arr_tmptime="+arr_tmptime); var lyy = arr_lyrics[ly].replace(reg_replacetime, ""); for ( i= 0; i < arr_tmptime.length; i++) { var arr_single= new Array(); var t = arr_tmptime[i]; // alert("t="+t); var min = t.substring(1,3); var sec = t.substring(4,t.length-1); //alert("sec="+sec); var time = Number(min) * 60 + Number(sec); // alert("time="+time); arr_single[0] = time; // if (!reg_dis.test(lyy)) // { // lyy += " "; // } arr_single[1] = lyy; arr_splitedLyrics.push(arr_single); } arr_splitedLyrics.sort(function(a, b){ return a[0]-b[0]; } ); } return arr_splitedLyrics; } html代码 <mce:script type="text/javascript" src="tt.js" mce_src="tt.js"></mce:script> <mce:script type="text/javascript" src="jquery-latest.js" mce_src="jquery-latest.js"></mce:script> <mce:script type="text/javascript" src="uft8.js" mce_src="uft8.js"></mce:script> <div align="center"> <object classid = "clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6" id="player" width = "250" height = "200"> <param name = "url" value = "冰雨.mp3" target="_blank" >参数 url 定义播放媒体的路径。 <!--是否自动播放--> <param NAME="Balance" VALUE="0"> <SCRIPT LANGUAGE="JavaScript"> </SCRIPT> <!--调整左右声道平衡,同上面旧播放器代码--> <param name="enabled" value="-1"> <!--播放器是否可人为控制--> <param NAME="EnableContextMenu" VALUE="-1"> <param name="defaultFrame" value="2"> <PARAM NAME="AutoStart" value="-1"> <param name="SAMIFilename" value="ll"> <param name="ShowStatusBar" value="0"> </object> </div> <div> <a href="#" mce_href="#" id="next" >下一首歌</a> <a href="#" mce_href="#" id="p">上一首歌</a> <input type="checkbox" id="ck">循环播放 时间 <input type="text" id="playerinfo"> </div> <!--显示歌词--> <div id="geci"> </div> <a href="#" mce_href="#" id="showLs" >查看歌曲</a> <div> <select name="select1" size="5" id="s" > <option value="1" selected > 朋友</option> <option value="2" > 你好吗</option> </select> </div> <div id="lcdiv"> <select name="ly" size="10" id="lc"> </select> </div> <mce:script type="text/javascript"><!-- player.closedCaption.SAMIFileName = "C://3.smi"; var num=0;//控制歌曲的下标 </SCRIPT> //监听播放器的事件 <SCRIPT event="playStateChange(star)" for="player" LANGUAGE="JScript"> //当播放下一首时同步播放列表的歌曲名 if( star==8 ){ num=num+1; if(num>=s.options.length){num=0} s.options[num].selected=true; } </SCRIPT> <SCRIPT FOR = player EVENT = buffering(Start)> if(Start==false){ setInterval(updatetime() ,1000);} </SCRIPT> <script type="text/javascript"> //显示播放时间 setInterval(updatetime,1000); function updatetime() { $("#playerinfo").val( player.controls.currentPositionString + " | " + player.currentMedia.durationString); } //监听循环的次数 $("#ck").click(function (){ if(ck.checked==true){ player.settings.setMode("loop",true) }else{ player.settings.setMode("loop",false) } }); //播放用户从播放列表中选中的歌曲 $("#s").click(function (){ num=this.selectedIndex; player.controls.playItem(player.currentPlaylist.item(num)); }); //播放下一首歌 $("#next").click( function (){ player.controls.next(); num=num+1; if(num>=s.options.length){num=0; player.controls.playItem(player.currentPlaylist.item(num)); } s.options[num].selected=true; }); //播放上一首歌 $("#p").click( function (){ num=num-1; if(num<0){ num=s.options.length-1; player.controls.playItem(player.currentPlaylist.item(num)); } s.options[num].selected=true; }); //生成歌词的数组(从隐藏域中提取歌词的字符串) $("#geci").hide(); $("#lcdiv").hide(); var ly=""; var arr_lyrics; var j=0; $("#showLs").click(function (){ var html = $.ajax({ url:"http://localhost:8080/music/lyrics.html", async: false }).responseText; $("#geci").html(html); arr_lyrics=get($("#geci").html()); for( i=0;i<arr_lyrics.length;i++){ ly+="<option >"+arr_lyrics[i][1]+"</option>"; } ly=ly.substring(2,ly.length); $("#lc").html(ly); $("#lc").attr({size:arr_lyrics.length}); $("#lcdiv").show("slow"); setInterval(playLyrics,3000); }); //歌词与歌曲的同步 function playLyrics (){ var playTime= player.controls.currentPositionString; var min =playTime.substring(0,2); var sec = playTime.substring(3,playTime.length); var p_time = Number(min) * 60 + Number(sec); for(i=0;i<lc.options.size-1;i++ ){ if( p_time>= arr_lyrics[i][0]&&p_time<arr_lyrics[i+1][0]){ j=i; break; } } lc.options[j].selected=true; alert(parseInt(lc.style.top)-1); }; // --></mce:script> <mce:script type="text/javascript" src="tt.js" mce_src="tt.js"></mce:script> <mce:script type="text/javascript" src="jquery-latest.js" mce_src="jquery-latest.js"></mce:script> <mce:script type="text/javascript" src="uft8.js" mce_src="uft8.js"></mce:script> <div align="center"> <object classid = "clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6" id="player" width = "250" height = "200"> <param name = "url" value = "冰雨.mp3" target="_blank" >参数 url 定义播放媒体的路径。 <!--是否自动播放--> <param NAME="Balance" VALUE="0"> <SCRIPT LANGUAGE="JavaScript"> </SCRIPT> <!--调整左右声道平衡,同上面旧播放器代码--> <param name="enabled" value="-1"> <!--播放器是否可人为控制--> <param NAME="EnableContextMenu" VALUE="-1"> <param name="defaultFrame" value="2"> <PARAM NAME="AutoStart" value="-1"> <param name="SAMIFilename" value="ll"> <param name="ShowStatusBar" value="0"> </object> </div> <div> <a href="#" mce_href="#" id="next" >下一首歌</a> <a href="#" mce_href="#" id="p">上一首歌</a> <input type="checkbox" id="ck">循环播放 时间 <input type="text" id="playerinfo"> </div> <!--显示歌词--> <div id="geci"> </div> <a href="#" mce_href="#" id="showLs" >查看歌曲</a> <div> <select name="select1" size="5" id="s" > <option value="1" selected > 朋友</option> <option value="2" > 你好吗</option> </select> </div> <div id="lcdiv"> <select name="ly" size="10" id="lc"> </select> </div> <mce:script type="text/javascript"><!-- player.closedCaption.SAMIFileName = "C://3.smi"; var num=0;//控制歌曲的下标 </SCRIPT> //监听播放器的事件 <SCRIPT event="playStateChange(star)" for="player" LANGUAGE="JScript"> //当播放下一首时同步播放列表的歌曲名 if( star==8 ){ num=num+1; if(num>=s.options.length){num=0} s.options[num].selected=true; } </SCRIPT> <SCRIPT FOR = player EVENT = buffering(Start)> if(Start==false){ setInterval(updatetime() ,1000);} </SCRIPT> <script type="text/javascript"> //显示播放时间 setInterval(updatetime,1000); function updatetime() { $("#playerinfo").val( player.controls.currentPositionString + " | " + player.currentMedia.durationString); } //监听循环的次数 $("#ck").click(function (){ if(ck.checked==true){ player.settings.setMode("loop",true) }else{ player.settings.setMode("loop",false) } }); //播放用户从播放列表中选中的歌曲 $("#s").click(function (){ num=this.selectedIndex; player.controls.playItem(player.currentPlaylist.item(num)); }); //播放下一首歌 $("#next").click( function (){ player.controls.next(); num=num+1; if(num>=s.options.length){num=0; player.controls.playItem(player.currentPlaylist.item(num)); } s.options[num].selected=true; }); //播放上一首歌 $("#p").click( function (){ num=num-1; if(num<0){ num=s.options.length-1; player.controls.playItem(player.currentPlaylist.item(num)); } s.options[num].selected=true; }); //生成歌词的数组(从隐藏域中提取歌词的字符串) $("#geci").hide(); $("#lcdiv").hide(); var ly=""; var arr_lyrics; var j=0; $("#showLs").click(function (){ var html = $.ajax({ url:"http://localhost:8080/music/lyrics.html", async: false }).responseText; $("#geci").html(html); arr_lyrics=get($("#geci").html()); for( i=0;i<arr_lyrics.length;i++){ ly+="<option >"+arr_lyrics[i][1]+"</option>"; } ly=ly.substring(2,ly.length); $("#lc").html(ly); $("#lc").attr({size:arr_lyrics.length}); $("#lcdiv").show("slow"); setInterval(playLyrics,3000); }); //歌词与歌曲的同步 function playLyrics (){ var playTime= player.controls.currentPositionString; var min =playTime.substring(0,2); var sec = playTime.substring(3,playTime.length); var p_time = Number(min) * 60 + Number(sec); for(i=0;i<lc.options.size-1;i++ ){ if( p_time>= arr_lyrics[i][0]&&p_time<arr_lyrics[i+1][0]){ j=i; break; } } lc.options[j].selected=true; alert(parseInt(lc.style.top)-1); }; // --></mce:script> lyrics.html <meta http-equiv="content-type" content="text/html; charset=utf-8"> <body> [ti:让我忘了你] [ar:沈世爱] [al:半杯苦咖啡] [by:bzmtv.com] [03:53.24][01:53.08][00:01.60]沈世爱 - 让我忘了你 [03:58.98][01:59.16][00:09.85]www.50004.com [02:35.66][00:39.31] [02:37.23][00:40.27]当我想忘记你 紧紧闭上双眼 [02:42.96][00:46.02]想着一定会有人代替你的容颜 [02:48.88][00:51.91]我不会再想念 慢慢睁开双眼 [02:54.68][00:57.77]泪水已经模糊了我的视线 [03:00.27][01:03.24]在我忘记你之前 仿佛看见你的脸 [03:06.12][01:09.48]轰轰烈烈的故事 平淡无奇的结局 [03:11.96][01:15.14]我不想再有期盼 你给我一点光芒 [03:18.12][01:21.15]游荡在整个城市的两端 [03:23.66][01:26.80]在夜深人静的时侯 看着窗外的月光 [03:29.47][01:32.51]莫名的孤独和寂寞 映在回忆的路上 [03:35.34][01:38.39]你已经渐渐的离去 消失了像风一样 [03:41.19][01:44.20]每次当我走得累了 幻想着有你在身旁 [03:51.88][01:51.86] </body> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <body> [ti:让我忘了你] [ar:沈世爱] [al:半杯苦咖啡] [by:bzmtv.com] [03:53.24][01:53.08][00:01.60]沈世爱 - 让我忘了你 [03:58.98][01:59.16][00:09.85]www.50004.com [02:35.66][00:39.31] [02:37.23][00:40.27]当我想忘记你 紧紧闭上双眼 [02:42.96][00:46.02]想着一定会有人代替你的容颜 [02:48.88][00:51.91]我不会再想念 慢慢睁开双眼 [02:54.68][00:57.77]泪水已经模糊了我的视线 [03:00.27][01:03.24]在我忘记你之前 仿佛看见你的脸 [03:06.12][01:09.48]轰轰烈烈的故事 平淡无奇的结局 [03:11.96][01:15.14]我不想再有期盼 你给我一点光芒 [03:18.12][01:21.15]游荡在整个城市的两端 [03:23.66][01:26.80]在夜深人静的时侯 看着窗外的月光 [03:29.47][01:32.51]莫名的孤独和寂寞 映在回忆的路上 [03:35.34][01:38.39]你已经渐渐的离去 消失了像风一样 [03:41.19][01:44.20]每次当我走得累了 幻想着有你在身旁 [03:51.88][01:51.86] </body> 播放列表的代码 Javascript代码 <SCRIPT language="JavaScript" type="text/JavaScript" > //生成播放列表playList var playlist= player.playlistCollection.newPlaylist("New"); //生成播放项 var m = player.newMedia("1.mp3"); //添加歌曲到播放列表 playlist.appendItem(m); //设置当前的播放器播放的歌曲列表 player.currentPlaylist = playlist; </SCRIPT> <SCRIPT language="JavaScript" type="text/JavaScript" > //生成播放列表playList var playlist= player.playlistCollection.newPlaylist("New"); //生成播放项 var m = player.newMedia("1.mp3"); //添加歌曲到播放列表 playlist.appendItem(m); //设置当前的播放器播放的歌曲列表 player.currentPlaylist = playlist; </SCRIPT>