概述:播放器 API
引用播放器
要使用API函數,您需要訪問播放器對象。這很容易做到。您只需要確保您的視頻標籤具有ID即可。示例嵌入代碼的ID為myPlayerID
,並且播放器對象將保留在myPlayer
變量。如果一頁上有多個視頻,請確保每個視頻標籤都有唯一的ID。
var myPlayer = videojs.getPlayer('myPlayerID');
播放器準備方法
Video.js設置視頻和API所需的時間將取決於多個因素,例如連接速度。因此,我們要使用播放器的ready()
觸發需要播放器API的任何代碼的方法。
videojs.getPlayer('myPlayerID').ready(function() {
var myPlayer = this;
// EXAMPLE: Handle an event
myPlayer.on('loadstart',doLoadstart);
});
播放器準備就緒與播放器準備就緒中的視頻
從本文檔的相關內容中,您可能會認為這是對API的安全使用:
videojs.getPlayer('myPlayerID').ready(function() {
var myPlayer = this;
// Play the video in the player
myPlayer.play()
});
在此示例中,僅由於播放器準備好進行交互而不能保證播放器中的視頻已加載並準備播放的問題。因此,您必須使用loadedmetadata
保證視頻可以播放的事件。該代碼將如下所示:
videojs.getPlayer('myPlayerID').ready(function() {
var myPlayer = this;
// Play the video in the player
myPlayer.on('loadedmetadata',function(){
myPlayer.play();
})
});
如果打電話給play()
方法是該功能中唯一要執行的任務,並且您不會以其他方式與播放器進行交互,因此可以將此代碼簡化為該代碼(無需使用ready()
方法):
videojs.getPlayer('myPlayerID').on('loadedmetadata',function(){
var myPlayer = this;
myPlayer.play();
});
API 方法
現在您可以使用準備就緒的播放器,可以控制視頻,獲取值或響應視頻事件。Video.js API函數名稱遵循HTML5媒體API。主要區別在於,getter / setter函數用於視頻屬性。
// setting a property on a bare HTML5 video element
myVideoElement.currentTime = "120";
// setting a property on a Video.js player
myPlayer.currentTime(120);
播放器API方法和事件的完整列表可以在播放器API文檔。