HTML5视频播放停止后自动关闭

写在前面的废话

最近接到一个小要求，顺手记录一下，客户要求视频播放完了之后关闭视频弹窗。
客户既是上帝，所以来了。

正题

<video id="video" poster="img" style='width: 486px;height: 486px' src='" + video + "' preload="auto" controls="controls" autoplay="autoplay"></video><img onClick="close1()" class="vclose" src="${base}/dist/images/gb.png" width="25" height="25"/>

var myVidoe=document.getElementById("video");
                myVidoe.playbackRate = 1;
                myVidoe.onloadstart = function(){
                    // console.log(`onloadstart  客户端开始请求数据  `);
                }
                myVidoe.onplay=function(){
                    // console.log(`开始播放时触发 `);
                }
                myVidoe.onplaying=function(){
                    // console.log(`真正处于播放的状态，这个时候我们才是真正的在观看视频。 `);
                }
                myVidoe.oncanplay=function(){
                    // console.log(`视频播放器已经可以开始播放视频了，但是只是预期可以正常播放，不保证之后的播放不会出现缓冲等待。 `);
                }
                myVidoe.onpause=function(){
                    // console.log(`暂停播放时触发 `);
                }
                myVidoe.onended = function(){
                    // this.src= "yy.mp4";
                    // console.info("视频播放完了")
                    close1();
                }
function close1() {
            var v = document.getElementById('video');//获取视频节点
            $('.videos').hide();//点击关闭按钮关闭暂停视频
            $(".videoed").show();
            v.pause();
            $('.videos').html();
        }

最后的废话

希望对你有所帮助，好记性不如烂笔头，欢迎来撩我↓↓↓