video播放器的监听

背景

1. 最近做视频功能的时候，要求在视频播放完成后出现弹出层。这里就需要用到对于视频播放完成事件的监听
2. 在全屏播放完成后的弹出层会被视频播放区域覆盖，需要在播放完成后自动推出全屏。但是我查阅的资料都是关于浏览器全屏的监听，也就是说只能推出浏览器全屏但是不能退出video播放器的全屏。
   如图所示：
   

以下是浏览器全屏监听事件

// Webkit
element.webkitRequestFullScreen();//进入全屏
document.webkitCancelFullScreen();//退出全屏
 
// Firefox
element.mozRequestFullScreen();
document.mozCancelFullScreen();
  
// W3C 
element.requestFullscreen();
document.exitFullscreen();

我解决问题的监听的部分代码

<script>
	    var elevideo = document.getElementById("study");//获取video标签
	    elevideo.addEventListener('ended', function () { //video视频播放结束监听
	        console.log("播放结束");
			 document.querySelector('#link').click();
			/* document.querySelector('.fullscreen').click(); */
		
	//监听网页是否全屏
			if (document.fullscreenElement) {
				document.querySelector('.fullscreen').click(); 
  } else {
   
  }


	    }, false);


	</script>

Javascript判断Video视频播放、暂停、结束完成及获取长度事件监听处理
相关代码详情请转载：https://www.jinliniuan.com/archives/1299.html

在下才疏学浅，这个监听肯定有标准的解决办法，但是在下一时半会儿没能找到，还望诸位大佬评论指教，文章内容幼稚，笑笑罢了，大佬莫喷。