好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

video实现浏览器打开自动播放

// html部分

<video loop controls  autoplay id="videomain">

    <source src="" type="video/mp4">

</video>

// js部分

let video1=document.querySelector("#videomain")

video1.src="build/assets/mp4/move2.mp4"

video1.load()

video1.play()

video标签自动循环播放,OK,运行下试试,报错: Uncaught (in promise) DOMException: play() failed because the user didn't interact with the document first ... 

百度了一下,发现从Chrome的66代版本之后,都是不自动播放的。

一开始,一脸懵逼,搜了下,video标签还有个muted(静音播放),加上后,视频是能播放了,但没声音啊0.0

经百度及调研,报错提示的大致意思是说,用户还没有交互,不能调play。用户的交互包括哪些呢?包括用户触发的touchend, click, doubleclick或者是 keydown事件,在这些事件里面就能调play.

想了下,点击、双击、按键都算用户交互,那鼠标移动算不算,要是算的话,那太好了

经测试,可以!

直接最外层dom,addEventListener('mousemove', function(){ video的dom调用play() })

完美解决!!!


查看更多关于video实现浏览器打开自动播放的详细内容...

  阅读:70次