怎么判断视频是否全下加载完成？

Question

怎么判断视频是否全下加载完成？网页有三个比较大的视频，每次刷新会导致非常卡顿，有什么办法可以解决吗？百度搜了好久也没有找到合适的解决办法，求大神给个思路，谢谢！

               <div class="row m5-video">

                    <div class="col-xs-12 col-sm-12 col-md-12">

                        <p class="anviz-sub-title anviz-content-center">M5 安装视频</p>

                        <div class="anviz-content anviz-content-center anviz-video-warning">请在wifi环境下观看此视频<span class="anviz-m5-video-size">  142.1M</span></div>

                        <video id="m5Warning" class="video-js" poster="img/video_bg/2.png" preload controls autobuffer style="width: 100%;height: auto;">

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

                            <object data="video/m5.mp4" width="100%" height="auto">

                                <embed src="video/m5.mp4" width="100%" height="auto"></embed>

                              </object>

                        </video>

                    </div>

                </div>

这是我放在html中的视频。

Answer 1

var vedioElem = document.getElementById('m5Warning');videoElem.addEventListener('canplaythrough',function(){});