28,409
社区成员
发帖
与我相关
我的任务
分享网页Media Player 同步lrc问题
下面3个文件1.htm top2.js 1.lrc
问题1
1.htm top2.js 一起运行的时候，为什么歌词还没有播放，就出现前3句同时播放第一行歌词的现象？如何修改正确？
爱拼才会赢
一时失志不免怨叹
一时失志不免怨叹
一时落魄不免胆寒
一时落魄不免胆寒
那通失去希望 每日醉茫茫
无魂有体亲像稻草人
人生可比是海上的波浪
有时起有时落 好运 歹命
改为
爱拼才会赢
一时落魄不免胆寒
那通失去希望 每日醉茫茫
无魂有体亲像稻草人
人生可比是海上的波浪
人生可比是海上的波浪
有时起有时落 好运 歹命
总吗要照起工来行
三分天注定 七分靠打拼
问题2
假如1.lrc 的网络地址是 http://www.****.com/1.lrc ,如何让客服端去读取 http://www.****.com/1.lrc ，来代替<!-- ×××--> 中的内容 ，下面这段改如何修改能正常播放
<span id=lrcdata ><!--
[ti:爱拼才会赢][ar:任贤齐][al:][offset:500][00:00.74]爱拼才会赢[00:10.45][02:26.40][01:26.48][00:24.97]一时失志不免怨叹[02:31.86][01:30.81][00:30.00]一时落魄不免胆寒[02:36.14][01:35.16][00:34.20]那通失去希望 每日醉茫茫[02:40.90][01:39.78][00:39.38]无魂有体亲像稻草人[02:44.91][01:43.83][00:43.78]人生可比是海上的波浪[02:49.22][01:48.14][00:48.38]有时起有时落 好运 歹命[02:56.02][01:55.08][00:55.53]总吗要照起工来行[03:00.31][01:59.29][01:00.10]三分天注定 七分靠打拼[03:04.43][02:03.62][01:04.79]爱拼才会赢[02:09.84][01:13.82]MUSIC[url:]
--></span>
1.htm
<object id=PlayerObj width=445 height=60 classid=clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6 align=left hspace=5>ASX File Name<param name=Volume value=100><param name=EnableContextMenu value=0><param name=url value="http://nhxx.org/office/zhsh/music/aiping.mp3"><param name=playCount value=100></object>
<br>
<table>
<tr><td id=lrcwt1></td></tr>
<tr><td id=lrcwt2></td></tr>
<tr><td id=lrcwt3></td></tr>
<tr><td class=kong>
<table border=0 cellspacing=0 cellpadding=0>
<tr><td id=lrcbox nowrap height=22></td></tr>
<tr><td nowrap height=22><span id=lrcbc style='overflow:hidden'></span></td></tr>
</table>
</td></tr>
<tr style='position:relative;top: -20px'><td id=lrcwt4></td></tr>
<tr style='position:relative;top: -20px'><td id=lrcwt5></td></tr>
<tr style='position:relative;top: -20px'><td id=lrcwt6></td></tr>
<tr style='position:relative;top: -20px'><td id=lrcwt7></td></tr>
<span id=lrcdata ><!--
[ti:爱拼才会赢][ar:任贤齐][al:][offset:500][00:00.74]爱拼才会赢[00:10.45][02:26.40][01:26.48][00:24.97]一时失志不免怨叹[02:31.86][01:30.81][00:30.00]一时落魄不免胆寒[02:36.14][01:35.16][00:34.20]那通失去希望 每日醉茫茫[02:40.90][01:39.78][00:39.38]无魂有体亲像稻草人[02:44.91][01:43.83][00:43.78]人生可比是海上的波浪[02:49.22][01:48.14][00:48.38]有时起有时落 好运 歹命[02:56.02][01:55.08][00:55.53]总吗要照起工来行[03:00.31][01:59.29][01:00.10]三分天注定 七分靠打拼[03:04.43][02:03.62][01:04.79]爱拼才会赢[02:09.84][01:13.82]MUSIC[url:]
--></span>
<script src=top2.js></script><script>playlrc(0)</script></table></td></tr></table>
top2.js
function lrcClass(tt)//LRC歌词处理 类
{
this.inr = [];//行
this.oTime = 0;//余补时间
this.dts = -1;//当前行显示的s
this.dte = -1;//当前行显示的e
this.dlt = -1;//当前行
tt = tt.replace(/\[\:\][^$\n]*(\n|$)/g,"$1");//去掉注解
tt = tt.replace(/\[[^\[\]\:]*\]/g,"");
tt = tt.replace(/\[[^\[\]]*[^\[\]\d]+[^\[\]]*\:[^\[\]]*\]/g,"");
tt = tt.replace(/\[[^\[\]]*\:[^\[\]]*[^\[\]\d\.]+[^\[\]]*\]/g,"");
tt = tt.replace(/<[^<>]*[^<>\d]+[^<>]*\:[^<>]*>/g,"");
tt = tt.replace(/<[^<>]*\:[^<>]*[^<>\d\.]+[^<>]*>/g,"");
while(/\[[^\[\]]+\:[^\[\]]+\]/.test(tt))
{tt = tt.replace(/((\[[^\[\]]+\:[^\[\]]+\])+[^\[\r\n]*)[^\[]*/,"\n");
var zzzt = RegExp.$1;
/^(.+\])([^\]]*)$/.exec(zzzt);
var ltxt = RegExp.$2;
var eft = RegExp.$1.slice(1,-1).split("][");
for(var ii=0; ii<eft.length; ii++)
{var sf = eft[ii].split(":");
var tse = parseInt(sf[0],10) * 60 + parseFloat(sf[1]);
var sso = { t:[] , w:[] , n:ltxt}
sso.t[0] = tse-this.oTime;
this.inr[this.inr.length] = sso;}}
this.inr = this.inr.sort( function(a,b){return a.t[0]-b.t[0];} );
for(var ii=0; ii<this.inr.length; ii++)
{while(/<[^<>]+\:[^<>]+>/.test(this.inr[ii].n))
{this.inr[ii].n = this.inr[ii].n.replace(/<(\d+)\:([\d\.]+)>/,"%=%");
var tse = parseInt(RegExp.$1,10) * 60 + parseFloat(RegExp.$2);
this.inr[ii].t[this.inr[ii].t.length] = tse-this.oTime;}
lrcbc.innerHTML = "<font>"+ this.inr[ii].n.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/%=%/g,"</font><font>") +" </font>";
var fall = lrcbc.getElementsByTagName("font");
for(var wi=0; wi<fall.length; wi++)
this.inr[ii].w[this.inr[ii].w.length] = fall[wi].offsetWidth;}
this.print("");
lrcwt1.innerText = "";
lrcwt2.innerText = "";
lrcwt3.innerText = "";
lrcwt4.innerText = "";
lrcwt5.innerText = "";
lrcwt6.innerText = "";
lrcwt7.innerText = "";
lrcbc.style.width = 0;}
lrcClass.prototype.run = function()
{try{if(this.oceanx==0)
this.runing(this.haohaiplay.controls.currentPosition, this.haohaiplay.currentMedia.duration);
else
this.runing(this.haohaiplay.GetPosition()/1000, this.haohaiplay.GetLength()/1000);
} catch(hh){}}
lrcClass.prototype.runing = function(tme, plen)
{if(tme<this.dts || tme>=this.dte)
{var ii;
for(ii=this.inr.length-1; ii>=0 && this.inr[ii].t[0]>tme; ii--){}
if(ii<0) return;
this.ddh = this.inr[ii].t;
this.fjh = this.inr[ii].w;
this.dts = this.inr[ii].t[0];
this.dte = (ii<this.inr.length-1)?this.inr[ii+1].t[0]:plen;
lrcwt1.innerText = this.retxt(ii-3);
lrcwt2.innerText = this.retxt(ii-2);
lrcwt3.innerText = this.retxt(ii-1);
lrcwt4.innerText = this.retxt(ii+1);
lrcwt5.innerText = this.retxt(ii+2);
lrcwt6.innerText = this.retxt(ii+3);
lrcwt7.innerText = this.retxt(ii+4);
this.print(this.retxt(ii));
if(this.dlt==ii-1)
{clearTimeout(this.hailang);
this.golrcoll(0);}
this.dlt = ii;}
var bbw = 0;
var ki;
for(ki=0; ki<this.ddh.length && this.ddh[ki]<=tme; ki++)
bbw += this.fjh[ki];
var kt = ki-1;
var sc = ((ki<this.ddh.length)?this.ddh[ki]:this.dte) - this.ddh[kt];
var tc = tme - this.ddh[kt];
bbw -= this.fjh[kt] - tc / sc * this.fjh[kt];
if(bbw>lrcbox.offsetWidth)
bbw = lrcbox.offsetWidth;
lrcbc.style.width = Math.round(bbw);}
lrcClass.prototype.retxt = function(i)
{return (i<0 || i>=this.inr.length)?"":this.inr[i].n;}
lrcClass.prototype.print = function(txt)
{lrcbox.innerText = txt;
lrcbc.innerText = txt;}
lrcClass.prototype.golrcoll = function(s)
{lrcoll.style.top = 25-(s++)*3;
lrcwt1.filters.alpha.opacity = 90-s*18;
lrcwt5.filters.alpha.opacity = s*18+10;
if(s<=5)
this.hailang = setTimeout(this.cnane+".golrcoll("+s+")",120);}
//
var lrcobj;
function playlrc(plrc)
{var m = lrcdata.innerHTML.slice(4,-3);
lrcobj = new lrcClass(m);
//lrcobj = new lrcClass(m);
lrcobj.cnane = "lrcobj";
lrcobj.haohaiplay = PlayerObj;
lrcobj.oceanx = plrc; //0为使用 Media Player 控件，1为使用 Real Player 控件
setInterval("lrcobj.run();",100);}
1.lrc
[ti:爱拼才会赢][ar:任贤齐][al:][offset:500][00:00.74]爱拼才会赢[00:10.45][02:26.40][01:26.48][00:24.97]一时失志不免怨叹[02:31.86][01:30.81][00:30.00]一时落魄不免胆寒[02:36.14][01:35.16][00:34.20]那通失去希望 每日醉茫茫[02:40.90][01:39.78][00:39.38]无魂有体亲像稻草人[02:44.91][01:43.83][00:43.78]人生可比是海上的波浪[02:49.22][01:48.14][00:48.38]有时起有时落 好运 歹命[02:56.02][01:55.08][00:55.53]总吗要照起工来行[03:00.31][01:59.29][01:00.10]三分天注定 七分靠打拼[03:04.43][02:03.62][01:04.79]爱拼才会赢[02:09.84][01:13.82]MUSIC[url:]
问题1
1.htm top2.js 一起运行的时候，为什么歌词还没有播放，就出现前3句同时播放第一行歌词的现象？如何修改正确？
爱拼才会赢
一时失志不免怨叹
一时失志不免怨叹
一时落魄不免胆寒
一时落魄不免胆寒
那通失去希望 每日醉茫茫
无魂有体亲像稻草人
人生可比是海上的波浪
有时起有时落 好运 歹命
改为
爱拼才会赢
一时落魄不免胆寒
那通失去希望 每日醉茫茫
无魂有体亲像稻草人
人生可比是海上的波浪
人生可比是海上的波浪
有时起有时落 好运 歹命
总吗要照起工来行
三分天注定 七分靠打拼
问题2
假如1.lrc 的网络地址是 http://www.****.com/1.lrc ,如何让客服端去读取 http://www.****.com/1.lrc ，来代替<!-- ×××--> 中的内容 ，下面这段改如何修改能正常播放
<span id=lrcdata ><!--
[ti:爱拼才会赢][ar:任贤齐][al:][offset:500][00:00.74]爱拼才会赢[00:10.45][02:26.40][01:26.48][00:24.97]一时失志不免怨叹[02:31.86][01:30.81][00:30.00]一时落魄不免胆寒[02:36.14][01:35.16][00:34.20]那通失去希望 每日醉茫茫[02:40.90][01:39.78][00:39.38]无魂有体亲像稻草人[02:44.91][01:43.83][00:43.78]人生可比是海上的波浪[02:49.22][01:48.14][00:48.38]有时起有时落 好运 歹命[02:56.02][01:55.08][00:55.53]总吗要照起工来行[03:00.31][01:59.29][01:00.10]三分天注定 七分靠打拼[03:04.43][02:03.62][01:04.79]爱拼才会赢[02:09.84][01:13.82]MUSIC[url:]
--></span>
1.htm
<object id=PlayerObj width=445 height=60 classid=clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6 align=left hspace=5>ASX File Name<param name=Volume value=100><param name=EnableContextMenu value=0><param name=url value="http://nhxx.org/office/zhsh/music/aiping.mp3"><param name=playCount value=100></object>
<br>
<table>
<tr><td id=lrcwt1></td></tr>
<tr><td id=lrcwt2></td></tr>
<tr><td id=lrcwt3></td></tr>
<tr><td class=kong>
<table border=0 cellspacing=0 cellpadding=0>
<tr><td id=lrcbox nowrap height=22></td></tr>
<tr><td nowrap height=22><span id=lrcbc style='overflow:hidden'></span></td></tr>
</table>
</td></tr>
<tr style='position:relative;top: -20px'><td id=lrcwt4></td></tr>
<tr style='position:relative;top: -20px'><td id=lrcwt5></td></tr>
<tr style='position:relative;top: -20px'><td id=lrcwt6></td></tr>
<tr style='position:relative;top: -20px'><td id=lrcwt7></td></tr>
<span id=lrcdata ><!--
[ti:爱拼才会赢][ar:任贤齐][al:][offset:500][00:00.74]爱拼才会赢[00:10.45][02:26.40][01:26.48][00:24.97]一时失志不免怨叹[02:31.86][01:30.81][00:30.00]一时落魄不免胆寒[02:36.14][01:35.16][00:34.20]那通失去希望 每日醉茫茫[02:40.90][01:39.78][00:39.38]无魂有体亲像稻草人[02:44.91][01:43.83][00:43.78]人生可比是海上的波浪[02:49.22][01:48.14][00:48.38]有时起有时落 好运 歹命[02:56.02][01:55.08][00:55.53]总吗要照起工来行[03:00.31][01:59.29][01:00.10]三分天注定 七分靠打拼[03:04.43][02:03.62][01:04.79]爱拼才会赢[02:09.84][01:13.82]MUSIC[url:]
--></span>
<script src=top2.js></script><script>playlrc(0)</script></table></td></tr></table>
top2.js
function lrcClass(tt)//LRC歌词处理 类
{
this.inr = [];//行
this.oTime = 0;//余补时间
this.dts = -1;//当前行显示的s
this.dte = -1;//当前行显示的e
this.dlt = -1;//当前行
tt = tt.replace(/\[\:\][^$\n]*(\n|$)/g,"$1");//去掉注解
tt = tt.replace(/\[[^\[\]\:]*\]/g,"");
tt = tt.replace(/\[[^\[\]]*[^\[\]\d]+[^\[\]]*\:[^\[\]]*\]/g,"");
tt = tt.replace(/\[[^\[\]]*\:[^\[\]]*[^\[\]\d\.]+[^\[\]]*\]/g,"");
tt = tt.replace(/<[^<>]*[^<>\d]+[^<>]*\:[^<>]*>/g,"");
tt = tt.replace(/<[^<>]*\:[^<>]*[^<>\d\.]+[^<>]*>/g,"");
while(/\[[^\[\]]+\:[^\[\]]+\]/.test(tt))
{tt = tt.replace(/((\[[^\[\]]+\:[^\[\]]+\])+[^\[\r\n]*)[^\[]*/,"\n");
var zzzt = RegExp.$1;
/^(.+\])([^\]]*)$/.exec(zzzt);
var ltxt = RegExp.$2;
var eft = RegExp.$1.slice(1,-1).split("][");
for(var ii=0; ii<eft.length; ii++)
{var sf = eft[ii].split(":");
var tse = parseInt(sf[0],10) * 60 + parseFloat(sf[1]);
var sso = { t:[] , w:[] , n:ltxt}
sso.t[0] = tse-this.oTime;
this.inr[this.inr.length] = sso;}}
this.inr = this.inr.sort( function(a,b){return a.t[0]-b.t[0];} );
for(var ii=0; ii<this.inr.length; ii++)
{while(/<[^<>]+\:[^<>]+>/.test(this.inr[ii].n))
{this.inr[ii].n = this.inr[ii].n.replace(/<(\d+)\:([\d\.]+)>/,"%=%");
var tse = parseInt(RegExp.$1,10) * 60 + parseFloat(RegExp.$2);
this.inr[ii].t[this.inr[ii].t.length] = tse-this.oTime;}
lrcbc.innerHTML = "<font>"+ this.inr[ii].n.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/%=%/g,"</font><font>") +" </font>";
var fall = lrcbc.getElementsByTagName("font");
for(var wi=0; wi<fall.length; wi++)
this.inr[ii].w[this.inr[ii].w.length] = fall[wi].offsetWidth;}
this.print("");
lrcwt1.innerText = "";
lrcwt2.innerText = "";
lrcwt3.innerText = "";
lrcwt4.innerText = "";
lrcwt5.innerText = "";
lrcwt6.innerText = "";
lrcwt7.innerText = "";
lrcbc.style.width = 0;}
lrcClass.prototype.run = function()
{try{if(this.oceanx==0)
this.runing(this.haohaiplay.controls.currentPosition, this.haohaiplay.currentMedia.duration);
else
this.runing(this.haohaiplay.GetPosition()/1000, this.haohaiplay.GetLength()/1000);
} catch(hh){}}
lrcClass.prototype.runing = function(tme, plen)
{if(tme<this.dts || tme>=this.dte)
{var ii;
for(ii=this.inr.length-1; ii>=0 && this.inr[ii].t[0]>tme; ii--){}
if(ii<0) return;
this.ddh = this.inr[ii].t;
this.fjh = this.inr[ii].w;
this.dts = this.inr[ii].t[0];
this.dte = (ii<this.inr.length-1)?this.inr[ii+1].t[0]:plen;
lrcwt1.innerText = this.retxt(ii-3);
lrcwt2.innerText = this.retxt(ii-2);
lrcwt3.innerText = this.retxt(ii-1);
lrcwt4.innerText = this.retxt(ii+1);
lrcwt5.innerText = this.retxt(ii+2);
lrcwt6.innerText = this.retxt(ii+3);
lrcwt7.innerText = this.retxt(ii+4);
this.print(this.retxt(ii));
if(this.dlt==ii-1)
{clearTimeout(this.hailang);
this.golrcoll(0);}
this.dlt = ii;}
var bbw = 0;
var ki;
for(ki=0; ki<this.ddh.length && this.ddh[ki]<=tme; ki++)
bbw += this.fjh[ki];
var kt = ki-1;
var sc = ((ki<this.ddh.length)?this.ddh[ki]:this.dte) - this.ddh[kt];
var tc = tme - this.ddh[kt];
bbw -= this.fjh[kt] - tc / sc * this.fjh[kt];
if(bbw>lrcbox.offsetWidth)
bbw = lrcbox.offsetWidth;
lrcbc.style.width = Math.round(bbw);}
lrcClass.prototype.retxt = function(i)
{return (i<0 || i>=this.inr.length)?"":this.inr[i].n;}
lrcClass.prototype.print = function(txt)
{lrcbox.innerText = txt;
lrcbc.innerText = txt;}
lrcClass.prototype.golrcoll = function(s)
{lrcoll.style.top = 25-(s++)*3;
lrcwt1.filters.alpha.opacity = 90-s*18;
lrcwt5.filters.alpha.opacity = s*18+10;
if(s<=5)
this.hailang = setTimeout(this.cnane+".golrcoll("+s+")",120);}
//
var lrcobj;
function playlrc(plrc)
{var m = lrcdata.innerHTML.slice(4,-3);
lrcobj = new lrcClass(m);
//lrcobj = new lrcClass(m);
lrcobj.cnane = "lrcobj";
lrcobj.haohaiplay = PlayerObj;
lrcobj.oceanx = plrc; //0为使用 Media Player 控件，1为使用 Real Player 控件
setInterval("lrcobj.run();",100);}
1.lrc
[ti:爱拼才会赢][ar:任贤齐][al:][offset:500][00:00.74]爱拼才会赢[00:10.45][02:26.40][01:26.48][00:24.97]一时失志不免怨叹[02:31.86][01:30.81][00:30.00]一时落魄不免胆寒[02:36.14][01:35.16][00:34.20]那通失去希望 每日醉茫茫[02:40.90][01:39.78][00:39.38]无魂有体亲像稻草人[02:44.91][01:43.83][00:43.78]人生可比是海上的波浪[02:49.22][01:48.14][00:48.38]有时起有时落 好运 歹命[02:56.02][01:55.08][00:55.53]总吗要照起工来行[03:00.31][01:59.29][01:00.10]三分天注定 七分靠打拼[03:04.43][02:03.62][01:04.79]爱拼才会赢[02:09.84][01:13.82]MUSIC[url:]
...全文
请发表友善的回复…
发表回复
