HTML5 使用aduio标签打造音乐播放器【二】

本文详细介绍了HTML5 audio标签所包含的所有媒体事件、方法及属性,包括如何通过事件监听实现音频播放的控制,以及如何使用特定属性来配置音频加载与播放行为。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

[size=large][align=center]html5中audio标签的事件、方法和属性[/align][/size]
[size=large] audio标签属于html5中的媒体标签,所以具有html5中的所有媒体事件。事件类型如下表所示。[/size]
[size=medium][b]事件 描述
canplay 当媒介能够开始播放但可能因缓冲而需要停止时运行脚本
canplaythrough 当媒介能够无需因缓冲而停止即可播放至结尾时运行脚本
durationchange 当媒介长度改变时运行脚本
emptied 当媒介资源元素突然为空时(网络错误、加载错误等)运行脚本
ended 当媒介已抵达结尾时运行脚本
error 当在元素加载期间发生错误时运行脚本
onloadeddata 当加载媒介数据时运行脚本
loadedmetadata 当媒介元素的持续时间以及其他媒介数据已加载时运行脚本
loadstart 当浏览器开始加载媒介数据时运行脚本
pause 当媒介数据暂停时运行脚本
play 当媒介数据将要开始播放时运行脚本
playing 当媒介数据已开始播放时运行脚本
progress 当浏览器正在取媒介数据时运行脚本
ratechange 当媒介数据的播放速率改变时运行脚本
readystatechange 当就绪状态(ready-state)改变时运行脚本
seeked 当媒介元素的定位属性 [1] 不再为真且定位已结束时运行脚本
seeking 当媒介元素的定位属性为真且定位已开始时运行脚本
stalled 当取回媒介数据过程中(延迟)存在错误时运行脚本
suspend 当浏览器已在取媒介数据但在取回整个媒介文件之前停止时运行脚本
timeupdate 当媒介改变其播放位置时运行脚本
volumechange 当媒介改变音量亦或当音量被设置为静音时运行脚本
waiting 当媒介已停止播放但打算继续播放时运行脚本[/b][/size]
[size=x-large]audio标签的方法
[/size]

p.load();
p.play();
p.pause();
p.stop();

[size=medium]这里用js原生的document.getElementById()方法获取的元素上执行。如果要用jquery,必须这么写$('')[0].xxx();
[/size]

[size=large]audio标签有如下几个属性[/size]
[size=medium][b]属性 描述
src 音频文件的url地址
preload 是否自动预加载,在设置了autoplay属性时此属性无效。
autoplay 自动开始播放
loop 循环播放
controls 显示浏览器默认播放控制器

[/b][/size]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值