html调用js自动播放音乐,使用html js实现点击文本和播放音乐的功能

f86855c85f632dbcfcdfed0db632a141.png

音频标记在HTML5中使用. 2113DOM中的文本如下. 文本是“播放”. 当单击5261时js实现网页音乐播放器,播放音乐广播4102js实现网页音乐播放器,并且文本将变为“暂停”. 根据是否在1653年播放音乐,这两个文本将切换. 这里要注意的一件事是音频兼容性问题. 如果考虑到它的兼容性,您可以看一下这种体验: HTML5音频如何与各种浏览器兼容以实现自动播放

ab6d7d5ff2f5ba48344900c5bf99287e.png

播放

20170311145809_956.png

JS部分:

96daf8701942cc5ca67438ab2c823f9e.png

$(document).ready(function() {

var voice = document.getElementById(voice); //获取到audio元素

$(.but).click(function() { //点击文字事件

if (voice.paused) { //判断音乐是否在播放中,暂停状态

voice.play(); //音乐播放

$(.but).text(暂停); //切换文字

} else { //播放状态

voice.pause(); //音乐停止

$(.but).text(播放); //切换文字

}

});

});

fbc60f533cfd652b82898220044e8ae8.png

resize,m_lfit,w_600,h_800,limit_1

本文来自电脑杂谈,转载请注明本文网址:

http://www.pc-fly.com/a/bofangqi/article-269850-1.html

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值