業務需求是H5頁面中嵌套video視頻,自定義控制視頻暫停或者播放,但是對於ios系統下手機,會出現兩個問題導致自定義播放事件失效:
1.ios系統下視頻自動回放全屏幕播放
2.播放完之後定義在最後一幀圖片上
最終目的是video播放完之後實現剛加載出頁面時候的效果(即第一張圖片效果)
重新刷新視頻即使重新刷新video標籤的src,所以代碼如下:
videoplay.addEventListener('ended', function (e) {
// 播放結束時觸發的時候使播放圖標顯示,同時播放完之後重新加載video的src
videoPalse.style.display = "block"; //播放圖標顯示
videoplay.src=require("./../../assets/laterImg/westlake.mp4"); //不是react框架寫的直接寫路徑就可以
})