當前位置:
首頁 >
前端技术
> javascript
>内容正文
javascript
JS判断视频Video的播放、暂停、结束完成及获取长度事件监听处理
生活随笔
收集整理的這篇文章主要介紹了
JS判断视频Video的播放、暂停、结束完成及获取长度事件监听处理
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
日常應用場景中,可能會遇到這么一個情況,需要判斷用戶是否完整的觀看完了一部視頻,在這個場景中,和視頻相關的事件大體涉及到幾個部分,獲取視頻長度,視頻開始播放,暫停播放和播放結束,下面來看下如何通過JavaScript來監聽獲取視頻的這幾種狀態。
var elevideo = document.getElementById("video");elevideo.addEventListener('loadedmetadata', function () { //加載數據//視頻的總長度console.log(elevideo.duration,'瓦達無大');});elevideo.addEventListener('play', function () { //播放開始執行的函數console.log("開始播放");document.getElementById("bofan").style.display = "none";});var elevideo = document.getElementById("video");elevideo.addEventListener('playing', function () { //播放中console.log("播放中");});var elevideo = document.getElementById("video");elevideo.addEventListener('waiting', function () { //加載console.log("加載中");});elevideo.addEventListener('pause', function () { //暫停開始執行的函數console.log("暫停播放");document.getElementById("bofan").style.display="flex";});elevideo.addEventListener('ended', function () { //結束console.log("播放結束");document.getElementById("bofan").style.display="flex";}, false); 新人創作打卡挑戰賽發博客就能抽獎!定制產品紅包拿不停!總結
以上是生活随笔為你收集整理的JS判断视频Video的播放、暂停、结束完成及获取长度事件监听处理的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: MATLAB用递归法求解集合子集,用递归
- 下一篇: idea javafx添加maven_J