第6章 HTML5中多媒体.pptVIP

使用canPlayType方法测试浏览器是否支持指定的媒介类型，该方法的定义如下。 var support=videoElement.canPlayType(type); videoElement表示页面上的video元素或audio元素。该方法使用一个参数type，该参数的指定方法与source元素的type参数的指定方法相同，都用播放文件的MIME类型来指定，可以在指定的字符串中加上表示媒体编码格式的codes参数。 该方法返回3个可能值（均为浏览器判断的结果）。 空字符串：浏览器不支持此种媒体类型； maybe：浏览器可能支持此种媒体类型； probably：浏览器确定支持此种媒体类型 6.3.2 canPlayType方法 6.4 多媒体元素的事件 6.4.1 事件处理 6.4.2 事件介绍 在利用video元素或audio元素读取或播放媒体数据的时候，会触发一系列的事件，如果JavaScript脚本来捕捉这些事件，就可以对这些事件进行处理了。对于这些事件的捕捉及其处理，可以按两种方式来进行。 一种是监听的方式：addEventListener(“事件名”,处理函数,处理方式)方法来对事件的发生进行监听，该方法的定义如下。 videoElement.addEventListener(type,listener,useCapture); videoElement表示页面上的video元素或audio元素。type为事件名称，listener表示绑定的函数，useCapture是一个布尔值，表示该事件的响应顺序，该值如果为true，则浏览器采用Capture响应方式，如果为false，浏览器采用bubbing响应方式，一般采用false，默认情况下也为false。 另一种是直接赋值的方式。事件处理方式为JavaScript脚本中常见的获取事件句柄的方式，如下例所示。 video id=video1 src=mrsoft.mov onplay=begin_playing()/video function begin_playing() { (中略) }; 6.4.1 事件处理 接下来，将介绍浏览器在请求媒体数据、下载媒体数据、播放媒体数据一直到播放结束这一系列过程中，到底会触发哪些事件。 loadstart事件：浏览器开始请求媒介； progress事件：浏览器正在获取媒介； suspend事件：浏览器非主动获取媒介数据，但没有加载完整个媒介资源； abort事件：浏览器在完全加载前中止获取媒介数据，但是并不是由错误引起的； error事件：获取媒介数据出错； emptied事件：媒介元素的网络状态突然变为未初始化；可能引起的原因有两个：1、载入媒体过程中突然发生一个致命错误；2、在浏览器正在选择支持的播放格式时，又调用了load方法重新载入媒体。 stalled事件：浏览器获取媒介数据异常； play事件：即将开始播放，当执行了play方法时触发，或数据下载后元素被设为autoplay（自动播放）属性。 pause事件：暂停播放，当执行了pause方法时触发。 loadedmetadata事件：浏览器获取完媒介资源的时长和字节 loadeddata事件：浏览器已加载当前播放位置的媒介数据； waiting事件：播放由于下一帧无效（例如未加载）而已停止（但浏览器确认下一帧会马上有效）； 6.4.2 事件介绍 playing事件：已经开始播放； canplay事件：浏览器能够开始媒介播放，但估计以当前速率播放不能直接将媒介播放完（播放期间需要缓冲）； canplaythrough事件：浏览器估计以当前速率直接播放可以直接播放完整个媒介资源（期间不需要缓冲）； seeking事件：浏览器正在请求数据（seeking属性值为true）； seeked事件：浏览器停止请求数据（seeking属性值为false）； timeupdate事件：当前播放位置（currentTime属性）改变，可能是播放过程中的自然改变，也可能是被人为地改变，或由于播放不能连续而发生的跳变； ended事件：播放由于媒介结束而停止； ratechange事件：默认播放速率（defaultPlaybackRate属性）改变或播放速率（playbackRate属性）改变； durationchange事件：媒介时长（duration属性）改变； volumechange事件：音量（volume属性）改变或静音（muted属性）。 本实例通过timeupdate事件动态显示媒体文件播放时间，效果如图6-3所示。 图6-3 timeupdate事件显示媒体文件播放