js监控视频播放的事件并打印log
html代码：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Multi Source</title>
</head>
<body>
<video src="http://www.w3school.com.cn/i/movie.mp4" controls autoplay></video>
<video src="http://www.w3school.com.cn/i/movie.mp4" controls autoplay></video>
<video src="http://www.w3school.com.cn/i/movie.mp4" controls autoplay></video>
<video src="http://www.w3school.com.cn/i/movie.mp4" controls autoplay></video>
<video src="http://www.w3school.com.cn/i/movie.mp4" controls autoplay></video>
<video src="http://www.w3school.com.cn/i/movie.mp4" controls autoplay></video>
<video src="http://www.w3school.com.cn/i/movie.mp4" controls autoplay></video>
<video src="http://www.w3school.com.cn/i/movie.mp4" controls autoplay></video>
<video src="http://www.w3school.com.cn/i/movie.mp4" controls autoplay></video>
<video src="http://www.w3school.com.cn/i/movie.mp4" controls autoplay></video>
<video src="http://www.w3school.com.cn/i/movie.mp4" controls autoplay></video>
</body>
</html>
js代码：
<script type="text/javascript">
window.addEventListener("load",getVideoEvent);
function getVideoEvent(){
var videoes=document.getElementsByTagName("video");
for (var i = 0; i < videoes.length; i++) {
showEventLog("video"+(i+1),videoes[i]);
}
} function showEventLog(videoNum,Media){
eventTester = function(e){
Media.addEventListener(e,function(){
console.log(videoNum+":"+e);
});
}
eventTester("loadstart"); //客户端开始请求数据
eventTester("progress"); //客户端正在请求数据
eventTester("suspend"); //延迟下载
eventTester("abort"); //客户端主动终止下载（不是因为错误引起），
eventTester("error"); //请求数据时遇到错误
eventTester("stalled"); //网速失速
eventTester("play"); //play()和autoplay开始播放时触发
eventTester("pause"); //pause()触发
eventTester("loadedmetadata"); //成功获取资源长度
eventTester("loadeddata"); //
eventTester("waiting"); //等待数据，并非错误
eventTester("playing"); //开始回放
eventTester("canplay"); //可以播放，但中途可能因为加载而暂停
eventTester("canplaythrough"); //可以播放，歌曲全部加载完毕
eventTester("seeking"); //寻找中
eventTester("seeked"); //寻找完毕
eventTester("timeupdate"); //播放时间改变
eventTester("ended"); //播放结束
eventTester("ratechange"); //播放速率改变
eventTester("durationchange"); //资源长度改变
eventTester("volumechange"); //音量改变
}
</script>
js监控视频播放的事件并打印log的更多相关文章
- js 监控浏览器关闭事件
代码如下: <!DOCTYPE html> <html> <head> <title>监控浏览器关闭事件</title> </head ...
- js监控键盘大小写事件
JavaScript键盘事件侦听 在使用JavaScript做WEB键盘事件侦听捕获时,主要采用onkeypress.onkeydown.onkeyup三个事件进行出来.该三个事 件的执行顺序如 ...
- js监控鼠标滚动事件
//滚动动画 windowAddMouseWheel(); function windowAddMouseWheel() { var scrollFunc = function (e) { e = e ...
- Node.js 教程 05 - EventEmitter(事件监听/发射器 )
目录: 前言 Node.js事件驱动介绍 Node.js事件 注册并发射自定义Node.js事件 EventEmitter介绍 EventEmitter常用的API error事件 继承EventEm ...
- React.js 小书 Lesson9 - 事件监听
作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson9 转载请注明出处,保留原文链接和作者信息. 在 React.js 里面监听事件是很容易的事情 ...
- Node js 安装+回调函数+事件
/* 从网站 https://nodejs.org/zh-cn/ 下载 这里用的 9.4.0 版本 下载完安装 安装目录是 D:\ApacheServer\node 一路默认安装 安装后打开cmd命令 ...
- js中的计时器事件`setTimeout()` 和 `setInterval()`
js中的计时器事件 在js中,通常会有一些事件,我们需要让它 间隔一段时间之后再发生,或者 每隔一段时间 发生一次,那就需要用到我们js中的计时事件 计时事件主要有两种: setTimeout() - ...
- js之DOM和事件
DOM 查找 直接查找 var obj = document.getElementById('i1') 间接查找 文件内容操作: innerText 仅文本 innerHTML 全内容 value i ...
- js多次触发事件，在一定延迟内只执行一次 （事件累加）
js多次触发事件,在一定延迟内只执行一次的案例: <!DOCTYPE html> <html> <head> <meta charset="UTF- ...
随机推荐
- CDZSC_2015寒假新人（1）——基础 i
Description “Point, point, life of student!” This is a ballad(歌谣)well known in colleges, and you mus ...
- Android中的消息机制：Handler消息传递机制
参考<疯狂android讲义>第2版3.5 P214 一.背景 出于性能优化考虑,Android的UI操作并不是线程安全的,这意味着如果有多个线程并发操作UI组件,可能导致线程安全问题.为 ...
- wdcp/wdlinux 在 UBUNTU/linux 中安装失败原因之创建用户
根本原因在于安装时创建的用户www 使用了和ubuntu已创建的用户,冲突了自然创建不了用户. 你可以修改lanmp.sh脚本中创建www用户时的代码,将1000改为其他数字. 也可以修改当前用户的U ...
- ipython的notebook
ipython是增强的python交互式shell.而notebook是在浏览器上运行ipython ubuntu下安装: sudo apt-get install ipython3 sudo apt ...
- Proud Merchants（POJ 3466 01背包+排序）
Proud Merchants Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 131072/65536 K (Java/Others) ...
- ASP.NET Ajax In Action!
创建XMLHTTPRequest 代码 Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeH ...
- sql helper
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.C ...
- asm.uew
/L16"ASM" Nocase Line Comment = ; File Extensions = ASM INC DEF /Colors = ,,,,, /Colors Ba ...
- android 签名被篡改(Keystore was tampered with, or password was incorrect)
在配置自定义签名时出现了"Keystore was tampered with, or password was incorrect"错误! 参考文档发现: If necessar ...
- cf479C Exams
C. Exams time limit per test 1 second memory limit per test 256 megabytes input standard input outpu ...