audio结束事件

<!DOCTYPE HTML>
<html>
<body>


<audio name="media" src="/i/horse.ogg" controls="controls" onended="test()">
Your browser does not support the audio element.
</audio>
<script>
function test(){
alert(2);
}
</script>  
</body>
</html>
### HTML Audio 对象的全部事件 HTML `<audio>` 元素支持多种事件,这些事件可以用于监听音频播放过程中的各种状态变化。以下是完整的事件列表: #### 媒体加载事件 - **loadstart**: 当浏览器开始加载媒体数据时触发[^1]。 - **progress**: 浏览器正在下载媒体资源时周期性触发[^2]。 - **suspend**: 下载暂停时触发(例如由于网络问题或用户操作)[^3]。 - **abort**: 如果媒体加载被故意终止,则会触发此事件[^4]。 - **error**: 加载过程中发生错误时触发[^5]。 - **emptied**: 当前播放列表为空或者媒体资源被移除时触发[^6]。 #### 媒体准备就绪事件 - **stalled**: 浏览器尝试获取媒体数据但失败时触发[^7]。 - **play**: 用户或程序请求播放时触发[^8]。 - **pause**: 音频暂停时触发[^9]。 - **loadedmetadata**: 当元数据(如持续时间、尺寸等)已加载完成时触发[^10]。 - **loadeddata**: 第一帧的数据已经加载完毕时触发[^11]。 - **canplay**: 足够的数据已经被缓冲到可以在不中断的情况下开始播放时触发[^12]。 - **canplaythrough**: 整个文件都可以在无需停止来缓存更多数据的情况下顺利播放时触发[^13]。 #### 播放控制事件 - **waiting**: 因为需要等待更多的数据而延迟播放时触发[^14]。 - **playing**: 在 `paused` 或者 `stopped` 后重新开始播放时触发[^15]。 - **ended**: 音频到达结尾并结束播放时触发[^16]。 - **durationchange**: 音频/视频的长度发生变化时触发[^17]。 - **timeupdate**: 每当当前播放位置改变时都会触发该事件[^18]。 #### 用户交互事件 - **seeking**: 寻找操作正在进行中时触发[^19]。 - **seeked**: 寻找操作完成后触发[^20]。 - **ratechange**: 播放速率更改时触发[^21]。 - **volumechange**: 音量调整时触发,包括静音设置的变化[^22]。 下面是一个简单的 JavaScript 示例,展示如何绑定部分常见的音频事件: ```javascript const audioElement = document.getElementById('myAudio'); // 绑定 play 事件 audioElement.addEventListener('play', () => { console.log('音频已经开始播放'); }); // 绑定 pause 事件 audioElement.addEventListener('pause', () => { console.log('音频已被暂停'); }); // 绑定 ended 事件 audioElement.addEventListener('ended', () => { console.log('音频播放已完成'); }); ``` 以上代码片段展示了如何通过 JavaScript 来捕获和响应特定的音频事件。 ---
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值