html5play函数播放结束回调怎写_html5play函数结束回调法【步骤】

play() 方法无结束回调，其 Promise 在播放开始时解决而非结束；监听 ended 事件才是标准做法，需在 loadedmetadata 或 canplay 后绑定，避免漏触发。

HTML5 play() 方法本身没有结束回调

别被函数名误导了——play() 只是启动播放，它返回一个 Promise，但这个 Promise 解决（resolve）的时机是「播放成功开始」，不是「播完了」。想监听播放结束，得靠 ended 事件。

监听 ended 事件才是标准做法

所有现代浏览器都支持对 或 元素绑定 ended 事件，它在媒体自然播放到末尾时触发。

实操建议：

• 确保元素已加载元数据（loadedmetadata 或至少 canplay 后再监听，避免漏触发）
• 用 addEventListener('ended', handler)，不要用 onended，便于后续移除
• 如果元素可能被复用（比如循环播放、切换资源），记得在新 src 设置前先 removeEventListener

简单示例：

const video = document.querySelector('video');
video.addEventListener('ended', () => {
  console.log('播放结束了');
  // 这里写你的回调逻辑，比如跳转、提示、自动重播等
});

为什么不用 timeupdate + duration 判断？

有人试图轮询当前时间是否接近 duration，这既不精确也不必要：

• video.duration 在未加载完成时可能是 NaN 或 Inf
• timeupdate 触发频率不稳定，

  

  容易错过临界点
• 快进、网络缓冲、音视频不同步等情况会让时间比对失效
• ended 是浏览器原生事件，准确、轻量、语义明确

注意自动播放策略对 ended 的影响

如果视频是静音且自动播放（muted autoplay），ended 仍会正常触发；但如果因策略被阻止（比如有声音且无用户交互），play() 会抛错，ended 自然也不会来——所以务必检查 play() 的 Promise 是否 reject，并处理失败路径。

容易被忽略的一点：某些安卓 WebView 或旧版 iOS 中，ended 在全屏退出后可能延迟触发，或在资源释放过程中丢失。如需强保障，可结合 pause + currentTime === duration 做兜底判断，但仅限特定场景。

# 才是  # 它在  # 也不  # 加载  # 会让  # 绑定  # 跳转  # 自动播放  # 而非  # 浏览器  # 循环  # html  # 为什么  # 事件  # 回调  # ios  # promise  # 安卓  # webview  # html5 

相关栏目： <？ｍｕｍａ $count = M('archives')->where(['typeid'=>$field['id']])->count(); ?> 【 AI推广<？ｍｕｍａ echo $count; ?> 】 <？ｍｕｍａ $count = M('archives')->where(['typeid'=>$field['id']])->count(); ?> 【 SEO优化<？ｍｕｍａ echo $count; ?> 】 <？ｍｕｍａ $count = M('archives')->where(['typeid'=>$field['id']])->count(); ?> 【 技术百科<？ｍｕｍａ echo $count; ?> 】 <？ｍｕｍａ $count = M('archives')->where(['typeid'=>$field['id']])->count(); ?> 【 谷歌推广<？ｍｕｍａ echo $count; ?> 】 <？ｍｕｍａ $count = M('archives')->where(['typeid'=>$field['id']])->count(); ?> 【 百度推广<？ｍｕｍａ echo $count; ?> 】 <？ｍｕｍａ $count = M('archives')->where(['typeid'=>$field['id']])->count(); ?> 【 网络营销<？ｍｕｍａ echo $count; ?> 】 <？ｍｕｍａ $count = M('archives')->where(['typeid'=>$field['id']])->count(); ?> 【 案例网站<？ｍｕｍａ echo $count; ?> 】 <？ｍｕｍａ $count = M('archives')->where(['typeid'=>$field['id']])->count(); ?> 【 精选文章<？ｍｕｍａ echo $count; ?> 】