注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

WWW.LOGO880.CN

WWW.LOGO880.CN 作品会说话 创意来呐喊

 
 
 

日志

 
 

音乐试听代码  

2010-01-07 23:26:10|  分类: 博客|笔记 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

www.logo880.cn提供

解决思路:
       在很多音乐或影视下载站上都有这样的功能,一个音乐列表,在单击链接时将播放相应音乐。其实就是动态设置BGSOUND、EMBED或OBJECT等元素的src属性。
具体步骤:
方法一:只在本页试听。
1.先在网页中插入src为空的背景音乐标签。

<bgsound id="bsound">

2. 实现动态设置BGSOUND元素的src属性的函数。

<script> [separator]
function playonline(url){
var obj=document.getElementById("bsound")
obj.src=url
}
</script>

3. 用按钮控制BGSOUND元素的src属性为目标文件地址。完整代码:

<bgsound id="bsound">
<button onClick="playonline(’/Music/The_Unforgiven.MP3’)">试听</button>
<button onClick="playonline(’’)">停止</button>
<script>
function playonline(url){
var obj=document.getElementById("bsound")
obj.src=url
}
</script>

方法二:新开一个小窗口试听。新窗口所加载的页面中已经做好播放音乐的控件,只等接收目标文件的参数后播放。
1.主要页面代码。

<script>
function newwin(url){
win=window.open("music.htm?url="+url,"music","width=200,height=100")
}
</script>
<button onClick="newwin(’/Music/The_Unforgiven.MP3’)">Open</button>

2.music.htm页的代码。

<button onClick="bsound.src=’’">停止播放</button>
<button onClick="self.close()">关闭窗口</button>
<script>
function QueryString(item){
//在URL中查找匹配变量item=值的字符,找到的话返回一个数组
var sValue=location.search.match(new RegExp("[\?\&]"+item+"=([^\&]*)(\&?)","i"))
//如果数组sValue不为空,返回它的第二项,否则返回sValue
return sValue?sValue[1]:sValue  
if(QueryString("url")){//如果URL中带有url参数
var url=QueryString("url")//将url参数的值赋给变量url
//输出背景音乐的代码
document.write("<bgsound id=\"bsound\" src=\""+url+"\">")
}
</script>


3.完整演示版本 (所有代码均在同一页) 。

<script>
function newwin(url){
//将id为code的对象内的文本赋给变量code
var code=document.getElementById("code").innerText
//打开200*100大小的空白窗口
win=window.open("","music","width=200,height=100")
//将变量code中的{src}替换为参数url
win.document.write(code.replace("{src}",url))
}
</script>
<button onClick="newwin(’/Music/The_Unforgiven.MP3’)">Open</button>
<xmp style="display:none" id="code">
<bgsound id="bsound" src="{src}">
<button onClick="bsound.src=’’">停止播放</button>
<button onClick="self.close()">关闭窗口</button>
</xmp>

特别提示
方法一的代码运行效果如图1.8.3所示,单击【试听】按钮,将以背景音乐形式播放指定音乐,单击【停止】按钮则停止音乐播放。图1.8.4为方法二的完整代码演示效果。

  评论这张
 
阅读(106)| 评论(0)
推荐 转载

历史上的今天

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017