html5如何嵌入视频,网页内嵌视频无法显示

　　在H5页面中嵌入视频的情况很多，有时会出现需要自动播放的情况。之前完全不觉得这是个问题，但是自己的项目需要视频的时候就有点sb了，老板的要求我都达不到。那就急了~ ~ ~

　　查各种资料，想办法，记录下来。核心是监控canplaythrough事件，然后让视频自己播放()。

　　在这个过程中，也发现了ios与Android的不同。Android上需要设置静音才能自动播放，而ios没有这个限制。当然，多媒体播放政策有厂商调整，需要注意。

　　有时可能是视频有问题，无法自动播放。之前就碰到过这个坑(在iphone8 plus上，安卓正常，但在iPhone X和XR上无法自动播放)。调整了很久，终于发现视频的问题，我就恶心了。

　　我在这里也区分安卓和ios，因为全屏安卓不仅不好看，你还可以直接回到第二阶段。你不是退出视频，而是退出页面。这个很痛苦，ios的视频挺好的。该系统带有一个操作按钮。

　　于是安卓取消了所有的控制按键，ios放开了按键。

　　视频v秀=os！== iOS class= video preload= auto 自动播放循环静音WebKit-play sinline= true play sinline= true @ loadstart= video loadstart @ canplaythrough= vid eoLoaded poster=。/images/cover . png ref= videoEle id= Android 来源：src= src type= video/MP4 /video loaded(){ this。$ refs . videele . play()；}说到视频，还有一个我之前遇到过的问题，就是切换不同的标签，然后切换视频。发现源码里写了视频路径，和上面一样，有问题。直接把连接写在视频里，就像下面这样：

　　video ref= video id= video preload= metadata :src= video src[video index]:poster= preSrc[video index] WebKit-plays inline plays inline/video data(){ preSrc:[require(。/images/pre1.png )、require(。/images/video-pre.jpg)]，videoSrc:[ require(。/images/invader-video.mp4 )、Require(。/images/brithday.mp4)]，}就是这样。本文介绍了在html5中解决嵌入式视频自动播放的问题。有关html5中嵌入式视频自动播放的更多信息，请搜索以前的文章或继续浏览下面的相关文章。希望你以后能支持我！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。