HTML5视频AB段局部循环播放需监听timeupdate事件动态控制currentTime，A点跳转后在seeked事件恢复播放，并用isSeeking标志防抖；支持setLoopRange动态设范围、play/ended事件激活/重置逻辑，兼容各浏览器边界情况。
HTML5视频实现AB段局部循环播放，核心在于监听播放进度、动态控制currentTime和播放状态，而非依赖原生属性（loop只支持整片循环）。
监听时间并截断播放范围
通过timeupdate事件持续检查当前播放位置，一旦超出B点就跳回A点，并保持播放；若未到A点就暂停或跳过（取决于需求）。
- 设置
A = 10秒、B = 25秒，监听video.currentTime - 当
currentTime >= B时，立即执行video.currentTime = A - 为避免卡顿，建议在
seeked事件后恢复播放（尤其在部分浏览器中跳转后自动暂停）
避免重复触发与性能优化
频繁的timeupdate可能每秒触发数十次，需防止连续跳转导致界面抖动或逻辑错乱。
- 用布尔标志（如
isSeeking）标记是否正在主动跳转，跳转中忽略timeupdate处理 - 或改用
requestAnimationFrame节流，比直接监听timeupdate更可控 - 首次进入AB段时再启用循环逻辑，避免视频加载初期误触发
支持手动启停与AB点动态调整
用户常需拖拽设置A/B点，或点击按钮开启/关闭循环，逻辑需解耦且可重置。
立即学习“前端免费学习笔记（深入）”；
- 将A/B值存为变量，提供
setLoopRange(a, b)方法更新范围 - 用
video.loop不参与控制，改用自定义状态isLoopEnabled - 暂停时清除跳转逻辑，播放时重新激活监听（例如在
play事件中注册timeupdate）
兼容性与边界情况处理
不同浏览器对seek和play()的响应有差异，需兜底处理。
- Chrome/Firefox通常允许
currentTime设为任意合法值；Safari在loadedmetadata前设值可能无效，应等待该事件后再初始化AB逻辑 - 当
A == B或A >= B时，自动禁用循环并提示 - 视频
ended时需手动重置currentTime并play()，否则无法触发后续循环
