+ -
当前位置:首页 → 问答吧 → 点击链接播放背景音乐出错,大家帮忙解决下!感激...

点击链接播放背景音乐出错,大家帮忙解决下!感激...

时间:2010-05-30

来源:互联网

代码如下:点击四个链接时播放相应的音乐,希望各位帮帮忙忙,看看这段js有什么问题.
<html> <head> <script type="text/javascript"> function $(id) { return typeof id=="string"?document.getElementById(id):id;} function createPlayer(url) { var box=document.createElement("div"); box.style.cssText="width:0px;height:0px;overflow:hidden;visibility:hidden;"; document.body.appendChild(box); if(!!window.ActiveXObject) { box.innerHTML="<object classid='clsid:6bf52a52-394a-11d3-b153-00c04f79faa6' id='mplayer' width='300' height='200'><param name='url' value='"+url+"' /><param name='uiMode' value='None' /><param name='AutoStart' value='0' /></object>"; } else { box.innerHTML="<object type='application/x-ms-wmp' id='mplayer' width='300' height='200'><param name='url' value='"+url+"' /><param name='AutoStart' value='false' /></object>"; } } function createPlayer2(url) { var box=document.createElement("div"); box.style.cssText="width:0px;height:0px;overflow:hidden;visibility:hidden;"; document.body.appendChild(box); if(!!window.ActiveXObject) { box.innerHTML="<object classid='clsid:6bf52a52-394a-11d3-b153-00c04f79faa6' id='mplayer' width='300' height='200'><param name='url' value='"+url+"' /><param name='uiMode' value='None' /><param name='AutoStart' value='0' /></object>"; } else { box.innerHTML="<object type='application/x-ms-wmp' id='mplayer2' width='300' height='200'><param name='url' value='"+url+"' /><param name='AutoStart' value='false' /></object>"; } } function createPlayer3(url) { var box=document.createElement("div"); box.style.cssText="width:0px;height:0px;overflow:hidden;visibility:hidden;"; document.body.appendChild(box); if(!!window.ActiveXObject) { box.innerHTML="<object classid='clsid:6bf52a52-394a-11d3-b153-00c04f79faa6' id='mplayer' width='300' height='200'><param name='url' value='"+url+"' /><param name='uiMode' value='None' /><param name='AutoStart' value='0' /></object>"; } else { box.innerHTML="<object type='application/x-ms-wmp' id='mplayer3' width='300' height='200'><param name='url' value='"+url+"' /><param name='AutoStart' value='false' /></object>"; } } function createPlayer4(url) { var box=document.createElement("div"); box.style.cssText="width:0px;height:0px;overflow:hidden;visibility:hidden;"; document.body.appendChild(box); if(!!window.ActiveXObject) { box.innerHTML="<object classid='clsid:6bf52a52-394a-11d3-b153-00c04f79faa6' id='mplayer' width='300' height='200'><param name='url' value='"+url+"' /><param name='uiMode' value='None' /><param name='AutoStart' value='0' /></object>"; } else { box.innerHTML="<object type='application/x-ms-wmp' id='mplayer4' width='300' height='200'><param name='url' value='"+url+"' /><param name='AutoStart' value='false' /></object>"; } } window.onload=function(){ createPlayer("http://www.skyestar.com/regWeb/jyb3464623174/UpLoad/2007-05-22-21-18-414.wma"); var MediaPlayer=$("mplayer"); $("play1").onclick=function(){MediaPlayer.controls.play();}; createPlayer2("http://www.xiyufeng.com/bbs/attachment/Fid_16/16_4004_5b880af20447a72.wma"); var MediaPlayer2=$("mplayer2"); $("play2").onclick=function(){MediaPlayer2.controls.play();}; createPlayer3("http://www.612345.com/wma/01/周杰伦雨下一整晚cd.wma"); var MediaPlayer3=$("mplayer3"); $("play3").onclick=function(){MediaPlayer3.controls.play();}; createPlayer4("http://media.twango.com/m1/original/0141/3af112deda284597872c01171eebdb75.mp3"); var MediaPlayer4=$("mplayer4"); $("play4").onclick=function(){MediaPlayer4.controls.play();}; }; </script> </head> <body> <a href="#" id="play1">音乐1</a> <a href="#" id="play2">音乐2</a> <a href="#" id="play3">音乐3</a> <a href="#" id="play4">音乐4</a> </body> </html>
 提示:您可以先修改部分代码再运行

作者: wenjfei   发布时间: 2010-05-30


<body bgcolor=#ff9933 text="#eeeee"> <div><P style="FONT-SIZE: 18px; FILTER: shadow(color=#000000,direction=110); HEIGHT: 18px" align=center><FONT color=#ffffff>EraIT-MediaPlayer V1.0版</FONT></P></div> <DIV id=MPlayerDiv> <!------ ↓初始化-------> <object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95" id="mplayer" width="0" height="0"> <param name="AudioStream" value="-1"> <param name="AutoSize" value="-1"> <!--是否自动调整播放大小--> <param name="AutoStart" value="-1"> <!--是否自动播放--> <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="bg.mp3" 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> <!------ ↑初始化-------> <SCRIPT language=JavaScript> <!-- function showMusic(){ var murl=unescape(window.event.srcElement.href); mplayer.Filename=murl; mplayer.play(); } --> </SCRIPT> <SCRIPT language=JScript> function show(Text){ info.innerHTML = '<p align="center" style="filter:shadow(color=#000000,direction=110);height:14;"><font color=ffffff>当前播放: </font><font color=#ffffaa>' + Text.innerText + '</font></P>'; } </SCRIPT> </DIV> <div> <OL> <LI> <a href="http://www.skyestar.com/regWeb/jyb3464623174/UpLoad/2007-05-22-21-18-414.wma" onclick="showMusic();show(this);return false;">音乐1</a> <LI><a href="http://www.xiyufeng.com/bbs/attachment/Fid_16/16_4004_5b880af20447a72.wma" onclick="showMusic();show(this);return false;">音乐2</a> <LI><a href="http://www.612345.com/wma/01/周杰伦雨下一整晚cd.wma" onclick="showMusic();show(this);return false">音乐3</a> <LI><a href="http://media.twango.com/m1/original/0141/3af112deda284597872c01171eebdb75.mp3" onclick="showMusic();show(this);return false;">音乐4</a> </LI></OL> </div> <div id=info style="FONT-SIZE: 16px; FILTER: shadow(color=#000000,direction=110); HEIGHT: 14px" align=center><FONT color=#ffffff></FONT></div>
 提示:您可以先修改部分代码再运行

作者: EraIT   发布时间: 2010-05-30

WMP由于新老版本控件(CLSID)的不同,js调用的方法略有不同。
上面是WMP老版本的控件js调用的方法,下面是较新WMP版本的控件js调用的方法。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <title>EraIT-MediaPlaye</title> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <style type=text/css> </style> <script language=Javascript> <!-- function showMusic(){ var wmplayer=document.getElementById("wmplayer"); var mUrl=window.event.srcElement.href; var mText=window.event.srcElement.innerText wmplayer.URL=mUrl; wmplayer.controls.play(); mInfo.innerHTML = '<p align="center" style="filter:shadow(color=#000000,direction=110);height:14;"><font color=ffffff>当前播放: </font><font color=#ffffaa>' + mText + '</font></P>'; } --> </script> </head> <body bgcolor=#ff9933 text="#eeeee"> <div><P style="font-SIZE: 18px; FILTER: shadow(color=#000000,direction=110); HEIGHT: 18px" align=center><font color=#ffffff>EraIT-MediaPlayer V1.0版</font></P></div> <div id=wmplayerdiv> <!------ ↓初始化-------> <object id="wmplayer" height="0" width="0" classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6"> <param NAME="AutoStart" VALUE="-1"> <!--是否自动播放--> <param NAME="Balance" VALUE="0"> <!--调整左右声道平衡--> <param name="enabled" value="-1"> <!--播放器是否可人为控制--> <param NAME="EnableContextMenu" VALUE="-1"> <!--是否启用上下文菜单--> <param NAME="url" VALUE=""> <!--播放的文件地址--> <param NAME="PlayCount" VALUE="1"> <!--播放次数控制,为整数--> <param name="rate" value="1"> <!--播放速率控制,1为正常,允许小数,1.0-2.0--> <param name="currentPosition" value="0"> <!--控件设置:当前位置--> <param name="currentMarker" value="0"> <!--控件设置:当前标记--> <param name="defaultFrame" value=""> <!--显示默认框架--> <param name="invokeURLs" value="0"> <!--脚本命令设置:是否调用URL--> <param name="baseURL" value=""> <!--脚本命令设置:被调用的URL--> <param name="stretchToFit" value="0"> <!--是否按比例伸展--> <param name="volume" value="50"> <!--默认声音大小0%-100%,50则为50%--> <param name="mute" value="0"> <!--是否静音--> <param name="uiMode" value="invisible"> <!--播放器显示模式:Full显示全部;mini最简化;None不显示播放控制,只显示视频窗口;invisible全部不显示--> <param name="windowlessVideo" value="0"> <!--如果是0可以允许全屏,否则只能在窗口中查看--> <param name="fullScreen" value="0"> <!--开始播放是否自动全屏--> <param name="enableErrorDialogs" value="-1"> <!--是否启用错误提示报告--> <param name="SAMIStyle" value> <!--SAMI样式--> <param name="SAMILang" value> <!--SAMI语言--> <param name="SAMIFilename" value> <!--字幕ID--> </object> <!------ ↑初始化-------> </div> <div> <OL> <LI><a href="http://www.skyestar.com/regWeb/jyb3464623174/UpLoad/2007-05-22-21-18-414.wma" onclick="showMusic();return false;">音乐1</a> <LI><a href="http://www.xiyufeng.com/bbs/attachment/Fid_16/16_4004_5b880af20447a72.wma" onclick="showMusic();return false;">音乐2</a> <LI><a href="http://www.612345.com/wma/01/周杰伦雨下一整晚cd.wma" onclick="showMusic();return false">音乐3</a> <LI><a href="http://media.twango.com/m1/original/0141/3af112deda284597872c01171eebdb75.mp3" onclick="showMusic();return false;">音乐4</a> </LI> </OL> </div> <div id=mInfo style="font-SIZE: 16px; FILTER: shadow(color=#000000,direction=110); HEIGHT: 14px" align=center> </div> </body> </html>
 提示:您可以先修改部分代码再运行

作者: EraIT   发布时间: 2010-05-31

相关阅读 更多

热门下载

更多