新的加載進度條(播放器,選項選擇 )
創建此類的實例。
參數:
名字 | 類型 | 屬性 | 描述 |
---|---|---|---|
播放器 |
播放器 |
這 |
|
選項 |
目的 |
<可選> |
播放器選項的鍵/值存儲。 |
延伸
方法
-
$ (選擇器,上下文選擇 )→ {元素|空}
-
查找與 a 匹配的單個 DOM 元素
選擇器
.這可以在成分
秒內容El()
或另一個自定義上下文。參數:
名字 類型 屬性 預設 描述 選擇器
細繩 一個有效的 CSS 選擇器,將被傳遞給
查詢選擇器
.語境
元素 | 細繩 <可選>
這個.contentEl() 要在其中查詢的 DOM 元素。也可以是選擇器字符串,在這種情況下,第一個匹配元素將用作上下文。如果丟失
這個.contentEl()
習慣了。如果這個.contentEl()
它什麼都不返回文檔
.傳回:
元素 | 無效的 -找到的 dom 元素,或 null
- 覆蓋:
- 請參閱:
-
$$ (選擇器,上下文選擇 )→ {節點列表}
-
查找所有匹配 a 的 DOM 元素
選擇器
.這可以在成分
秒內容El()
或另一個自定義上下文。參數:
名字 類型 屬性 預設 描述 選擇器
細繩 一個有效的 CSS 選擇器,將被傳遞給
查詢選擇器全部
.語境
元素 | 細繩 <可選>
這個.contentEl() 要在其中查詢的 DOM 元素。也可以是選擇器字符串,在這種情況下,第一個匹配元素將用作上下文。如果丟失
這個.contentEl()
習慣了。如果這個.contentEl()
它什麼都不返回文檔
.傳回:
節點列表 -找到的 dom 元素列表
- 覆蓋:
- 請參閱:
-
添加孩子(孩子,選項選擇, 指數選擇 )→ { 成分 }
-
添加一個孩子
成分
在當前成分
.參數:
名字 類型 屬性 預設 描述 孩子
細繩 | 成分 要添加的子項的名稱或實例。
選項
目的 <可選>
{} 將傳遞給孩子的孩子的選項的鍵/值存儲。
指數
數字 <可選>
這個.children_.length 嘗試將子項添加到的索引。
- 覆蓋:
-
添加類(類添加)
-
將 CSS 類名添加到
成分
元素。參數:
名字 類型 描述 添加類
細繩 要添加的 CSS 類名
- 覆蓋:
-
模糊()
-
從此組件中移除焦點
- 覆蓋:
-
抽象的構建CSS類()→ {字符串}
-
構建默認的 DOM 類名。應該被子組件覆蓋。
傳回:
細繩 -此對象的 DOM 類名稱。
- 覆蓋:
-
取消動畫幀(ID)→ {數字}
-
取消傳遞給的排隊回調組件#requestAnimationFrame (rAF)。
如果您通過排隊 rAF 回調組件#requestAnimationFrame , 使用此函數代替
window.cancelAnimationFrame
.如果你不這樣做,你的處置偵聽器將不會被清理直到組件#dispose!參數:
名字 類型 描述 id
數字 要清除的 rAF ID。的返回值組件#requestAnimationFrame .
傳回:
數字 -返回已清除的 rAF ID。
- 覆蓋:
- 請參閱:
-
取消命名動畫幀(姓名)
-
取消當前命名的動畫幀(如果存在)。
參數:
名字 類型 描述 姓名
細繩 要取消的 requestAnimationFrame 的名稱。
-
孩子們()→ {數組}
-
獲取所有子組件的數組
傳回:
大批 -這些孩子
- 覆蓋:
-
清除間隔(intervalId)→ {數字}
-
清除通過創建的間隔
窗口.setInterval
或者組件#setInterval .如果您通過以下方式設置間隔組件#setInterval使用此功能而不是window.clearInterval
.如果你不這樣做,你的處置偵聽器將不會被清理,直到組件#dispose!參數:
名字 類型 描述 間隔Id
數字 要清除的間隔的 ID。的返回值組件#setInterval或者
窗口.setInterval
.傳回:
數字 -返回已清除的間隔 ID。
- 覆蓋:
- 請參閱:
-
清除超時(timeoutId)→ {數字}
-
清除通過創建的超時
窗口.setTimeout
或者組件#setTimeout .如果您通過以下方式設置超時組件#setTimeout使用此功能而不是window.clear超時
.如果你不這樣做,你的處置偵聽器將不會被清理,直到組件#dispose!參數:
名字 類型 描述 超時ID
數字 要清除的超時 ID。的返回值組件#setTimeout或者
窗口.setTimeout
.傳回:
數字 -返回已清除的超時 ID。
- 覆蓋:
- 請參閱:
-
內容El ()→ {元素}
-
返回
成分
s DOM 元素。這是孩子們被插入的地方。這通常與返回的元素相同組件#el .傳回:
元素 -這個的內容元素
成分
.- 覆蓋:
-
創建El ()→ {元素}
-
創建
成分
的 DOM 元素傳回:
元素 -創建的元素。
- 覆蓋:
-
當前維度(寬度或高度)→ {數字}
-
獲取組件元素的計算寬度或高度。
用途
window.getComputedStyle
.參數:
名字 類型 描述 寬度或高度
細繩 包含“寬度”或“高度”的字符串。想要哪個就拿哪個。
傳回:
數字 -被請求的維度,如果沒有為該維度設置任何內容,則為 0。
-
當前維度()→ { 組件~維度對象 }
-
獲取一個對象,該對象包含組件元素的計算寬度和高度值。
用途
window.getComputedStyle
. -
當前高度()→ {數字}
-
獲取組件元素的計算高度。
用途
window.getComputedStyle
.傳回:
數字 -組件元素的計算高度。
- 覆蓋:
-
當前寬度()→ {數字}
-
獲取組件元素的計算寬度。
用途
window.getComputedStyle
.傳回:
數字 -組件元素的計算寬度。
- 覆蓋:
-
方面(寬度或高度,數字選擇 , 跳過聽眾選擇 )→ {數字}
-
獲取或設置的寬度或高度
成分
元素。這是共享代碼組件#width和組件#height .須知:
- 如果數字中的寬度或高度,這將返回帶有“px”後綴的數字。
- 如果寬度/高度是百分比,這將返回後綴為“%”的百分比
- 隱藏元素的寬度為 0
window.getComputedStyle
.這個函數默認為成分
秒樣式.寬度
並回到window.getComputedStyle
.看這了解更多信息 - 如果您想要組件的計算樣式,請使用組件#currentWidth和 {Component#currentHeight
參數:
名字 類型 屬性 描述 寬度或高度
細繩 8 '寬度'或'高度'
數
數字 | 細繩 <可選>
8 新維度
跳過聽眾
布爾值 <可選>
跳過 componentresize 事件觸發
火災:
傳回:
數字 -獲取時的維度,如果未設置則為 0
- 覆蓋:
-
方面(寬度,高度)
-
設置寬度和高度
成分
同時元素。參數:
名字 類型 描述 寬度
數字 | 細繩 設置的寬度
成分
s 元素到。高度
數字 | 細繩 設置的高度
成分
s 元素到。- 覆蓋:
-
處置(選項)
-
處置的
成分
和所有子組件。參數:
名字 類型 描述 選項
目的 性質
名字 類型 描述 原來的El
元素 用於替換播放器元素的元素
火災:
- 覆蓋:
-
埃爾()→ {元素}
-
得到
成分
DOM 元素傳回:
元素 -這個的 DOM 元素
成分
.- 覆蓋:
-
啟用觸摸活動()
-
每當發生觸摸事件時,此函數都會報告用戶活動。這可以被任何希望觸摸事件以另一種方式起作用的子組件關閉。
發生觸摸事件時報告用戶觸摸活動。用戶活動用於確定控件何時顯示/隱藏。鼠標事件很簡單,因為任何鼠標事件都應該顯示控件。因此,我們捕獲冒泡到玩家的鼠標事件並在發生時報告活動。對於觸摸事件,它並不像
觸摸啟動
和觸摸端
切換播放器控件。所以觸摸事件也不能在玩家層面幫助我們。異步檢查用戶活動。因此,可能發生的情況是視頻上的點擊事件會關閉控件。然後
觸摸端
事件冒泡到玩家。如果它報告用戶活動,它將立即重新打開控件。我們也不希望完全阻止觸摸事件冒泡。此外一個觸摸移動
事件和點擊以外的任何東西,都不應該重新打開控件。監聽事件:
- 組件#event:touchstart
- 組件#event:touchmove
- 組件#event:touchend
- 組件#event:touchcancel
-
重點()
-
將焦點設置到該組件
- 覆蓋:
-
獲取屬性(屬性)→ {字符串|空}
-
獲取屬性的值
成分
元素。參數:
名字 類型 描述 屬性
細繩 要從中獲取值的屬性的名稱。
傳回:
細繩 | 無效的 -- 請求的屬性的值。 - 如果屬性不存在或沒有值,在某些瀏覽器上可以是空字符串 - 如果屬性不存在或沒有值,大多數瀏覽器將返回 null。
- 覆蓋:
- 請參閱:
-
得到孩子(姓名)→ { 成分 |未定義}
-
歸還孩子
成分
與給定的姓名
.參數:
名字 類型 描述 姓名
細繩 孩子的名字
成分
要得到。- 覆蓋:
-
通過 Id 獲取孩子(ID)→ { 成分 |未定義}
-
歸還孩子
成分
與給定的ID
.參數:
名字 類型 描述 id
細繩 孩子的id
成分
要得到。- 覆蓋:
-
得到後代(……名字)→ { 成分 |未定義}
-
返回後代
成分
跟隨給定的後代名字
.例如 ['foo', 'bar', 'baz'] 將嘗試在當前組件上獲取 'foo',在 'foo' 組件上獲取 'bar' 並在 'bar' 組件上獲取 'baz' 並返回 undefined 如果這些都不存在。參數:
名字 類型 屬性 描述 名字
...數組。<字符串> | 細繩 <可重複>
孩子的名字
成分
要得到。- 覆蓋:
-
handleKeyDown (事件)
-
當此組件收到
按鍵
它不處理的事件,它將事件傳遞給 Player 進行處理。參數:
名字 類型 描述 事件
事件目標~事件 這
按鍵
導致調用此函數的事件。- 覆蓋:
-
handleKeyPress(事件)
-
許多組件曾經有一個
處理KeyPress
方法,這個名字不好命名,因為它聽了一個按鍵
事件。此方法名稱現在委託給handleKeyDown
.這意味著任何人打電話處理KeyPress
不會看到他們的方法調用停止工作。參數:
名字 類型 描述 事件
事件目標~事件 導致調用此函數的事件。
-
抽象的處理語言變化()
-
處理組件中播放器的語言更改。應該被子組件覆蓋。
-
hasClass(classToCheck) → {boolean}
-
檢查組件的元素是否具有 CSS 類名。
參數:
名字 類型 描述 類檢查
細繩 要檢查的 CSS 類名。
傳回:
布爾值 -- 如果
成分
有課。 - 如果是假的成分
沒有類`
- 覆蓋:
- 如果
-
高度(數選擇 , 跳過聽眾選擇 )→ {數字|字符串}
-
根據 CSS 樣式獲取或設置組件的高度。看組件#尺寸了解更多詳細信息。
參數:
名字 類型 屬性 描述 數
數字 | 細繩 <可選>
您要設置的高度後綴為“%”、“px”或什麼都不加。
跳過聽眾
布爾值 <可選>
跳過 componentresize 事件觸發
傳回:
數字 | 細繩 -獲取時的寬度,沒有寬度則為零。可以是帶有“%”或“px”的後綴字符串。
- 覆蓋:
-
隱藏()
-
隱藏
成分
s 元素,如果它當前通過向其添加“vjs-hidden”類名來顯示。- 覆蓋:
-
ID ()→ {字符串}
-
得到這個
成分
編號傳回:
細繩 -這個的id
成分
- 覆蓋:
-
初始化孩子()
-
添加並初始化默認子項
成分
基於選項。- 覆蓋:
-
已處置()→ {布爾值}
-
確定該組件是否已被處置。
傳回:
布爾值 -如果該組件已被處置,將
真的
.否則,錯誤的
.- 覆蓋:
-
本地化(字符串,標記選擇, 默認值選擇 )→ {字符串}
-
本地化給定英文字符串的字符串。
如果提供了令牌,它將嘗試對提供的字符串運行簡單的令牌替換。它尋找的標記看起來像
{1}
索引被 1-indexed 到 tokens 數組中。如果一個
默認值
提供,它將使用它細繩
,如果在提供的語言文件中找不到值。如果您想要一個用於令牌替換的描述性密鑰但具有簡潔的本地化字符串並且不需要en.json
被包括。目前,它用於進度條計時。
{
“進度條計時:currentTime={1} duration={2}”:“{1} of {2}” }
然後像這樣使用它:
this.localize('進度條計時:currentTime={1} duration{2}', [this.player_.currentTime(), this.player_.duration()], '{1} of {2}');
輸出如下:
24:56 的 01:23
.參數:
名字 類型 屬性 描述 細繩
細繩 要本地化的字符串和要在語言文件中查找的鍵。
代幣
數組.<字符串> <可選>
如果當前項目有代幣替換,請在此處提供代幣。
默認值
細繩 <可選>
默認為
細繩
.如果查找鍵需要分開,可以是用於令牌替換的默認值。傳回:
細繩 -本地化字符串或如果沒有本地化存在英文字符串。
- 覆蓋:
-
姓名()→ {字符串}
-
得到
成分
的名字。該名稱用於引用成分
並在註冊時設置。傳回:
細繩 -這個的名字
成分
.- 覆蓋:
-
選項(對象)→ {對象}
-
選項對象與新選項的深度合併。
注意:當兩個
對象
和選項
包含其值為對象的屬性。這兩個屬性使用 module:mergeOptions 合併參數:
名字 類型 描述 對象
目的 包含新選項的對象。
傳回:
目的 -一個新的對象
這個.options_
和對象
融合在一起。- 覆蓋:
-
玩家()→ { 播放器 }
-
返回播放器那
成分
已附加到。- 覆蓋:
-
準備好()→ { 成分 }
-
將偵聽器綁定到組件的就緒狀態。與事件監聽器不同的是,如果就緒事件已經發生,它會立即觸發函數。
- 覆蓋:
-
移除屬性(屬性)
-
從中刪除一個屬性
成分
元素。參數:
名字 類型 描述 屬性
細繩 要刪除的屬性的名稱。
- 覆蓋:
- 請參閱:
-
刪除孩子(成分)
-
刪除一個孩子
成分
由此成分
的孩子名單。還刪除了孩子成分
來自這個的元素成分
元素。參數:
名字 類型 描述 成分
成分 孩子
成分
去除。- 覆蓋:
-
移除類(classToRemove)
-
從中刪除 CSS 類名
成分
元素。參數:
名字 類型 描述 要刪除的類
細繩 要刪除的 CSS 類名
- 覆蓋:
-
請求動畫幀(fn)→ {數字}
-
排隊要傳遞給 requestAnimationFrame (rAF) 的回調,但有一些額外的好處:
-
回退到不支持 rAF 的瀏覽器組件#setTimeout .
-
回調變成了組件~GenericCallback(即綁定到組件)。
-
如果組件在調用之前被釋放,rAF 回調的自動取消將被處理。
參數:
名字 類型 描述 fn
組件~GenericCallback 將綁定到此組件並在瀏覽器下一次重繪之前執行的函數。
監聽事件:
- 覆蓋:
- 請參閱:
-
-
請求命名動畫幀(姓名,姓名)
-
請求一個動畫幀,但只有一個命名的動畫幀會被排隊。在前一個完成之前,永遠不會添加另一個。
參數:
名字 類型 描述 姓名
細繩 給這個 requestAnimationFrame 的名稱
fn
組件~GenericCallback 將綁定到此組件並在瀏覽器下一次重繪之前執行的函數。
-
設置屬性(屬性,值)
-
設置屬性的值
成分
的元素參數:
名字 類型 描述 屬性
細繩 要設置的屬性的名稱。
價值
細繩 將屬性設置為的值。
- 覆蓋:
- 請參閱:
-
設置間隔(fn, 區間)→ {數字}
-
創建一個函數,每隔
X
毫秒。這個函數是一個包裝器窗口.setInterval
.不過,有幾個理由改用這個。- 它通過清除組件#clearInterval什麼時候組件#dispose被調用。
- 函數回調將是組件~GenericCallback
參數:
名字 類型 描述 fn
組件~GenericCallback 每次運行的函數
X
秒。間隔
數字 每隔一段時間執行指定的函數
X
毫秒。監聽事件:
- 覆蓋:
- 請參閱:
-
設置超時(fn,超時)→ {數字}
-
創建一個在一個函數之後運行的函數
X
毫秒超時。這個函數是一個包裝器窗口.setTimeout
.不過,有幾個理由改用這個:- 它通過清除組件#clearTimeout什麼時候組件#dispose被調用。
- 函數回調將變成組件~GenericCallback
注意:你不能使用
window.clearTimeout
在這個函數返回的 id 上。這將導致其處理偵聽器無法清理!請用組件#clearTimeout或者組件#dispose反而。參數:
名字 類型 描述 fn
組件~GenericCallback 之後將運行的函數
暫停
.超時
數字 在執行指定函數之前延遲的超時時間(以毫秒為單位)。
監聽事件:
- 覆蓋:
- 請參閱:
-
展示()
-
顯示
成分
s 元素(如果通過從中刪除“vjs-hidden”類名來隱藏它)。- 覆蓋:
-
切換類(classToToggle, 謂詞選擇 )
-
在組件的元素中添加或刪除 CSS 類名。
類切換
被添加時組件#hasClass會返回錯誤。類切換
被刪除時組件#hasClass會返回 true。
參數:
名字 類型 屬性 描述 類切換
細繩 添加或刪除的類基於 (@link Component#hasClass}
謂詞
布爾值 | dom~謂詞 <可選>
一個 Dom~predicate 函數或一個布爾值
- 覆蓋:
-
觸發就緒()
-
為此觸發所有準備好的監聽器
成分
.火災:
- 覆蓋:
-
更新(事件選擇 )
-
更新進度條
參數:
名字 類型 屬性 描述 事件
事件目標~事件 <可選>
這
進步
導致此函數運行的事件。監聽事件:
-
寬度(數選擇 , 跳過聽眾選擇 )→ {數字|字符串}
-
根據 CSS 樣式獲取或設置組件的寬度。看組件#尺寸了解更多詳細信息。
參數:
名字 類型 屬性 描述 數
數字 | 細繩 <可選>
您要設置的寬度後綴為“%”、“px”或什麼都不加。
跳過聽眾
布爾值 <可選>
跳過 componentresize 事件觸發
傳回:
數字 | 細繩 -獲取時的寬度,沒有寬度則為零。可以是帶有“%”或“px”的後綴字符串。
- 覆蓋:
活動
-
組件調整大小
-
調整組件大小時觸發。
類型:
-
處置
-
當一個
成分
被處置。類型:
特性:
名字 類型 屬性 預設 描述 氣泡
布爾值 <可選>
假的 設置為 false 以便 dispose 事件不會冒泡
- 覆蓋:
-
準備
-
當一個
成分
準備好了。類型:
- 覆蓋:
-
輕敲
-
當一個
成分
被竊聽。類型:
- 覆蓋: