网页音乐播放器

kulinglei

浏览: 101371 次
性别:
来自: 深圳

最近访客更多访客>>

likoaong

yeoyoyo

Vicue

杨小草

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

项目解决方案

音乐 HTML

js代码
把歌词文件解析成数组

 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代码

<script type="text/javascript" src="tt.js"></script>
<script type="text/javascript" src="jquery-latest.js"></script>
<script type="text/javascript" src="uft8.js"></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="#" id="next" >下一首歌</a>
         <a href="#" id="p">上一首歌</a>
         <input type="checkbox" id="ck">循环播放
		时间 <input type="text" id="playerinfo">
    </div>
  
   
   <!--显示歌词--> 
   <div id="geci">
		
    </div>
<a 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>

 
<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);

};




 </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>

播放列表的代码

<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>

参考资料
http://www.cnblogs.com/davyjiang/articles/1243397.html

分享到：

aop的思想和用途 | java 的时间

2009-02-21 16:22
浏览 1607
评论(1)
论坛回复 / 浏览 (1 / 12288)
分类:Web前端
查看更多

1 楼 zhoujj303030 2009-02-22

能够把源码打一个包提供下载那就更好了！

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

网页音乐播放器

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

网页音乐播放器

评论

发表评论

相关推荐

Apache Commons fileUpload实现文件上传

在大型网站中用cookie替代SESSION的可行性分析

图片服务器和文字服务器的问题

用java去访问web service 提供的电视节目预告

jsp的跳转异常org.apache.struts.chain.commands.InvalidPa

接口与他的实现类

javaWeb的字符乱码解决方法

最近访客更多访客>>