HTML5 的 <video>標(biāo)簽有許多默認(rèn)的事件，如果我們通過(guò)這個(gè)播放器加載一段視頻文件，從開(kāi)始加載到播放結(jié)束，都經(jīng)歷了哪些事件呢？這些事件的觸發(fā)順序如何？

[1]HTML5:onplay
[2]HTML5:onwaiting
[3]HTML5:ondurationchange
[4]HTML5:onloadedmetadata
[5]HTML5:onloadeddata
[6]HTML5:oncanplay
[7]HTML5:onplaying
[8]HTML5:oncanplaythrough
[9]HTML5:onended

事件詳細(xì)說(shuō)明：

?

onplay:

播放器不在保持“暫停”狀態(tài)，即“play()”方法被調(diào)用或者autoplay屬性設(shè)置為true期望播放器自動(dòng)開(kāi)始播放。

onwaiting:

播放由于下一幀數(shù)據(jù)未獲取到導(dǎo)致播放停止，但是播放器沒(méi)有主動(dòng)預(yù)期其停止，仍然在努力的獲取數(shù)據(jù)，簡(jiǎn)單的說(shuō)就是在等待下一幀視頻數(shù)據(jù)，暫時(shí)還無(wú)法播放。

ondurationchange：

duration(視頻播放總時(shí)長(zhǎng))屬性被更新。

onloadedmetadata：

獲取視頻meta信息完畢，這個(gè)時(shí)候播放器已經(jīng)獲取到了視頻時(shí)長(zhǎng)和視頻資源的文件大小。

onloadeddata：

視頻播放器第一次完成了當(dāng)前播放位置的視頻渲染。

oncanplay：

視頻播放器已經(jīng)可以開(kāi)始播放視頻了，但是只是預(yù)期可以正常播放，不保證之后的播放不會(huì)出現(xiàn)緩沖等待。

onplaying：

真正處于播放的狀態(tài)，這個(gè)時(shí)候我們才是真正的在觀看視頻。

oncanplaythrough：

播放器認(rèn)為從現(xiàn)在開(kāi)始播放，直到播放結(jié)束，不再會(huì)因?yàn)榈却竺娴臄?shù)據(jù)而出現(xiàn)緩沖等待。（注意，這個(gè)只是播放器根據(jù)網(wǎng)速和播放進(jìn)度的預(yù)期估計(jì)，不代表后面的數(shù)據(jù)全部都預(yù)先緩沖完畢了，如果你手動(dòng)推動(dòng)控制欄的進(jìn)度條，可能仍然會(huì)出現(xiàn)緩沖的，或者你后面網(wǎng)絡(luò)斷開(kāi)了，一樣沒(méi)辦法繼續(xù)播放，除非是真的緩沖完了）

onended：

播放完畢。

?

更多事件說(shuō)明請(qǐng)參閱：

http://www.whatwg.org/specs/web-apps/current-work/multipage/video.html#mediaevents

?

轉(zhuǎn)：http://popotang.com/blog/html5-video-events-list.html

轉(zhuǎn)載于:https://www.cnblogs.com/shuaixf/archive/2013/02/05/2892932.html

總結(jié)

以上是生活随笔為你收集整理的HTML5 VIDEO标签播放事件流水的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。