前言

在利用video元素或audio元素读取或播放媒体数据时,会触发一系列事件,如果用js脚本来捕抓这些事件,就可以对着这些事件进行处理了。

捕抓的方式有两种:

第一种是监听的方式。使用vedio或audio元素的addEventListener方法来对事件进行监听,该方法可以定义如下:

vedioElement.addEventListener("error",function(){},false);

第二种是 采用获取事件句柄方式,如下:

<vedio id="vedio1" src="sample.mov" onplay="toPlay()"></vedio>
function toPlay(){
...
};

事件介绍

事件类型 描述
loadstart 浏览器开始在网上寻找媒体数据
progress 浏览器正在获取媒体数据
suspend 浏览器暂停获取媒体数据,但是下载过程并没有正常结束
abort 浏览器下载完全部媒体数据之前中止获取媒体数据,但并不是下载错误引起的
error 获取媒体数据的过程中出错
stalled 浏览器尝试获取数据失败
play 即将开始播放,当执行了play方法时触发,或数据下载后元素被设置为autoplay属性
pause 播放暂停,当执行了pause方法时触发
loadedmetadata 浏览器获取完媒体的时长和字节数
loadeddata 浏览器已加载完当前播放位置的媒体数据,准备播放
waiting 播放过程由于得不到下一帧而暂停播放(如下一帧尚未加载完),但很快就能够得到下一帧
playing 正在播放
canplay 浏览器能够播放媒体,但估计以当前播放速率不能直接将媒体播放完,播放期间需要缓冲
canplaythrough 浏览器可以播放媒体,而且以当前播放速率能够将媒体播放完,不再需要进行缓冲
seeking seeking属性变为true,表明浏览器正在请求数据
seeked seeking属性变为false,表示浏览器停止请求数据
timeupdate 当前播放位置发生改变,可能是播放过程中的自然改变,也可能是人为的改变,或由于播放不能连续而发生的跳变
ended 播放结束后停止播放
ratechange defaulplaybackRate属性(默认播放速率)或playbackRate属性(当前播放速率)发生改变
durationchange 播放时长发生改变
volumechange volume属性(音量)发生改变或muted属性(静音状态)发生改变

demo

参考链接
http://www.runoob.com/jsref/d...


mydef
129 声望9 粉丝

路漫漫,好好学习,天天向上