当使用任何Video.js设置方法初始化视频时,将建立Player类的实例。html
建立实例后,能够经过两种方式在全局访问:算法
调用videojs('example_video_1');
直接经过videojs.players.example_video_1使用它;数组
建立此类的实例浏览器
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
tag |
Element | 用于配置选项的原始 video DOM 元素。缓存 |
|
options |
Object | <optional> | 选项名称和值的对象。网络 |
ready |
Component~ReadyCallback | <optional> | Ready 回调函数。app |
全局播放器列表。dom
静态 getTagSettings(tag) → {Object}异步
获取标签设置ide
名称 | 类型 | 描述 |
---|---|---|
tag |
Element | 播放器标签 |
查找与选择器匹配的单个DOM元素。 这能够在组件contentEl()或另外一个自定义上下文中。
名称 | 类型 | 属性 | 默认 | 描述 |
---|---|---|---|---|
selector |
string | 一个有效的CSS选择器,它将被传递给querySelector。 |
||
context |
Element | string | <optional> | this.contentEl() | 要查询的DOM元素。 也能够是选择器字符串,在这种状况下,第一个匹配元素将用做上下文。 若是缺失则this.contentEl()被使用。 若是this.contentEl()不返回任何东西,它会回到 document。 |
查找与选择器匹配的全部DOM元素。 这能够在组件contentEl()或另外一个自定义上下文中。
名称 | 类型 | 属性 | 默认 | 描述 |
---|---|---|---|---|
selector |
string | 一个有效的CSS选择器,它将被传递给 |
||
context |
Element | string | <optional> | this.contentEl() | 要查询的DOM元素。 也能够是选择器字符串,在这种状况下,第一个匹配元素将用做上下文。 若是缺失则this.contentEl()被使用。 若是this.contentEl()不返回任何东西,它会回到 document。 |
在当前组件中添加子组件。
名称 |
类型 | 属性 | 默认 | 描述 |
---|---|---|---|---|
child |
string | Component | 要添加的子级的名称或实例。 |
||
options |
Object | <optional> | {} | 将要传递给子级的子组件选项的键/值存储。 |
index |
number | <optional> | this.children_.length | 尝试添加子元素的索引。 |
名称 | 类型 | 描述 |
---|---|---|
classToAdd |
string | 添加的CSS类名称 |
建立远程TextTrack和HTMLTrackElement。 每当源更改时,它将从视频元素中自动删除,除非manualCleanup设置为false。
名称 | 类型 | 属性 | 默认 | 描述 |
---|---|---|---|---|
options |
Object | 在建立期间传递到HTMLTrackElement的选项。 请参阅您应该使用的对象属性的HTMLTrackElement。 |
||
manualCleanup |
boolean | <optional> | true | 若是设置为false,TextTrack 不会自动删除 |
已建立并添加到HTMLTrackElementList和远程TextTrackList的HTMLTrackElement
用于向TextTrackList添加TextTrack的辅助方法。
除了W3C设置,咱们容许经过选项添加附加信息。
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
kind |
string | <optional> | 您要添加的TextTrack的类型 |
label |
string | <optional> | 标签给出TextTrack标签 |
language |
string | <optional> | 在TextTrack上设置的语言 |
用于播放器宽高比的getter / setter。
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
ratio |
string | <optional> | 设置播放器宽高比的值。 |
- undefined 设置时
获取AudioTrackList
当前音轨列表
获取或设置autoplay属性。
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
value |
boolean | <optional> |
|
获取时自动播放的当前值
今后组件中删除焦点
使用已下载的视频时间数组获取TimeRange对象。 若是您只想要下载的视频的百分比,请使用bufferedPercent。
获取上次缓冲时间范围的结束时间这在进度条中用于封装全部时间范围。
获取已下载视频的百分比(十进制)。 此方法不是原生HTML video API的一部分。
构建默认DOM类名称。 应该被子组件覆盖。
取消传递到Component#requestAnimationFrame(rAF)的排队回调。
若是您经过Component#requestAnimationFrame对rAF回调进行排队,请使用此函数,而不是window.cancelAnimationFrame。 若是没有,你的Dispose侦听器将不会被清除,直到Component#dispose!
名称 | 类型 | 描述 |
---|---|---|
id |
number | 要清除的rAF ID。 Component#requestAnimationFrame的返回值。 |
检查播放器是否能够播放给定的mimetype
名称 | 类型 | 描述 |
---|---|---|
type |
string | 要检查的mimetype |
获取全部子组件的数组
清除经过window.setInterval或Component#setInterval建立的间隔。 若是经过组件#setInterval设置一个inteval,则使用此函数,而不是使用window.clearInterval。 若是你不这样作,你的配置侦听器将不会被清理,直到Component#dispose!
名称 | 类型 | 描述 |
---|---|---|
intervalId |
number | 要清除的间隔的ID。Component#setInterval或window.setInterval的返回值。 |
清除经过window.setTimeout或Component#setTimeout建立的超时。 若是经过Component#setTimeout设置超时,则使用此函数,而不是使用window.clearTimout。 若是你不这样作,你的配置侦听器将不会被清理,直到Component#dispose!
名称 | 类型 | 描述 |
---|---|---|
timeoutId |
number | 要清除的超时的ID。 Component#setTimeout或window.setTimeout的返回值。 |
返回组件DOM元素。 这是子组件插入的地方。 这一般与Component#el中返回的元素相同。
获取或设置控件是否显示。
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
bool |
boolean | <optional> |
|
建立播放器的DOM元素。
建立一个简单的模态对话框(ModalDialog组件的一个实例),当即用任意内容覆盖播放器,并在关闭时删除它本身。
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
content |
string | function | Element |Array | null | 与ModalDialog#content的同名参数相同。 最直接的用法是提供一个字符串或DOM元素。 |
|
options |
Object | <optional> | 将被传递到ModalDialog的额外选项。 |
获取组件元素计算样式的宽度或高度。 使用window.getComputedStyle。
名称 | 类型 | 描述 |
---|---|---|
widthOrHeight |
string | 包含“width”或“height”的字符串。 不管你想获得什么。 |
获取包含组件计算样式的宽度和高度值的对象。
获取组件计算样式的高度。 使用window.getComputedStyle。
返回当前资源对象。
返回全部当前资源对象。
返回当前资源值的彻底限定网址,例如 http://mysite.com/video.mp4能够与currentType结合使用,以帮助重建当前源对象。
获取或设置当前时间(以秒为单位)
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
seconds |
number | string | <optional> | 设置时寻找的时间,以秒为单位 |
获取当前的资源类型,例如 video / mp4,这能够容许您重建当前源对象,以便之后能够加载相同的资源和技术
获取组件计算样式的宽度。 使用window.getComputedStyle。
获取当前的defaultMuted状态,或打开或关闭defaultMuted。 defaultMuted表示初始播放时静音的状态。
var myPlayer = videojs('some-player-id'); myPlayer.src("http://www.example.com/path/to/video.mp4"); // 获取的值为false console.log(myPlayer.defaultMuted()); // 设置为true myPlayer.defaultMuted(true); // 获取的值为 true console.log(myPlayer.defaultMuted());
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
defaultMuted |
boolean | <optional> |
|
- 若是defaultMuted为off并获取,则为false
- 设置时引用的当前播放器
获取或设置当前默认播放速率。 例如默认回放速率1.0表示正常速度,0.5表示半速回放。 defaultPlaybackRate只会表示视频的初始playbackRate,而不是当前的playbackRate。
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
rate |
number | <optional> | 要设置的新默认播放速率。 |
- 设置时返回播放器
播放器宽度和高度的getter / setter。
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
dimension |
string | 此字符串多是: - 'width' - 'height' |
|
value |
number | <optional> | 第一个参数中指定的维度值。 |
同时设置Component元素的宽度和高度。
名称 | 类型 | 描述 |
---|---|---|
width |
number | string | 要设置的Component元素的宽度。 |
height |
number | string | 要设置的Component元素的高度。 |
销毁视频播放器并进行任何须要的清理。
若是您要动态向DOM添加视频和从DOM中删除视频,这一点尤为有用。
一般获取视频的时间长度(以秒为单位); 除了最罕见的用例以外,参数不会被传递给方法
注意:视频必须在已知持续时间以前开始加载,对于Flash,在视频开始播放以前可能没法知道。
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
seconds |
number | <optional> | 视频设置的持续时间(以秒为单位) |
获取组件的的dom元素
The DOM element for this Component
.
此函数在触摸事件发生时报告用户活动。这能够关闭任何想要触摸事件以另一种方式运行的子组件
触摸事件发生时报告用户触摸活动。用户活动用于肯定控件什么时候应显示/隐藏。它是简单的,当涉及到鼠标事件,由于任何鼠标事件应该显示控件。所以,咱们捕获向玩家发出的鼠标事件,并在发生时报告活动。有触摸事件它不像touchstart和touchend切换播放器控件同样简单。因此触摸事件不能帮助咱们在播放器级别。
异步检查用户活动。因此可能发生的是在视频上的点击事件关闭控制。而后,touchend事件冒泡向玩家。其中,若是它报告用户活动,将从新打开控件。咱们也不想彻底阻止触摸事件冒泡。此外,touchmove事件和除了水龙头以外的任何东西,不该该从新打开控制。
返回玩家是否处于“已结束”状态。
若是玩家处于结束状态,则返回True ,不然返回false 。
当不支持全屏时,咱们能够将视频容器拉伸到浏览器容许的宽度。
设置或获取当前的MediaError
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
err |
MediaError | string | number | <optional> | MediaError或要变成MediaError的字符串/数字 |
当获取时的当前MediaError(或null)
在全屏模式后,将视频恢复到正常大小
退出全窗口模式
肯定是否支持flexbox
- false 若是不支持flexbox
Player上的vjs-fluid className的getter / setter / toggler。
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
bool |
boolean | <optional> |
|
- `undefined` when setting.
将焦点设置到此组件
在ESC键上检查呼叫是退出完整窗口仍是全屏
名称 | 类型 | 描述 |
---|---|---|
event |
string | Event to check for key press |
获取Components元素上的属性值。
名称 | 类型 | 描述 |
---|---|---|
attribute |
string | 要获取值的属性的名称。 |
- 若是该属性不存在或没有值,则多是某些浏览器上的空字符串 - 若是属性不存在或没有值,大多数浏览器将返回null。
DOM API
获取缓存值的对象。
获取当前对象缓存
返回具备给定名称的子组件。
名称 | 类型 | 描述 |
---|---|---|
name |
string | 要获取的子组件的名称。 |
具备给定名称的子组件或未定义。
返回具备给定ID的子组件。
名称 | 类型 | 描述 |
---|---|---|
id |
string | 要获取的子组件的id。 |
检查组件的元素是否具备CSS类名称。
名称 | 类型 | 描述 |
---|---|---|
classToCheck |
string | 要检查的CSS类名称。 |
Component
has the class. - False if the `Component` does not have the class`
报告播放器是否有可用的插件。
这里不报告插件是否已经在这个播放器上被初始化了。 为此,usingPlugin。
名称 | 类型 | 描述 |
---|---|---|
name |
string | 插件的名称。 |
该播放器是否具备可用的请求插件。
Add/remove the vjs-has-started class
名称 | 类型 | 描述 |
---|---|---|
hasStarted |
boolean |
|
the boolean value of hasStarted
A getter/setter for the Player
's height.
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
value |
number | <optional> | The value to set the `Player's heigth to. |
The current height of the Player
when getting.
Hide the Component
s element if it is currently showing by adding the 'vjs-hidden` class name to it.
Get this Component
s ID
The id of this Component
根据选项添加和初始化默认的子组件。
Gets or sets the audio flag
名称 | 类型 | 描述 |
---|---|---|
bool |
boolean |
|
The current value of isAudio when getting
检查播放器是否处于全屏模式,或者告诉播放器它是或不是全屏模式。
注意:根据最新的HTML5规范,isFullscreen再也不是官方属性,而是使用document.fullscreenElement。 但isFullscreen仍然是内部播放器运行的有价值的属性。
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
isFS |
boolean | <optional> | 设置播放器当前的全屏状态 |
- false 若是全屏是关闭的而且获取时
The player's language code NOTE: The language should be set in the player options if you want the the controls to be built with a specific language. Changing the lanugage later will not update controls text.
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
code |
string | <optional> | the language code to set the player to |
The current language code when getting
Get the player's language dictionary Merge every time, because a newly added plugin might call videojs.addLanguage() at any time Languages specified directly in the player options have precedence
An array of of supported languages
Begin loading the src data.
Localize a string given the string in english.
名称 | 类型 | 描述 |
---|---|---|
string |
string | The string to localize. |
The localized string or if no localization exists the english string.
Get or set the loop attribute on the video element.
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
value |
boolean | <optional> |
|
The current value of loop when getting
Get the current muted state, or turn mute on or off
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
muted |
boolean | <optional> |
|
- false if mute is off and getting
Get the Component
s name. The name gets used to reference the Component
and is set during registration.
The name of this Component
.
从如下列表中的代码返回元素的网络活动的当前状态。
当前网络活动状态
Deep merge of options objects with new options.
Note: When both
obj
andoptions
contain properties whose values are objects. The two properties get merged using module:mergeOptions
名称 | 类型 | 描述 |
---|---|---|
obj |
Object | The object that contains new options. |
A new object of this.options_
and obj
merged together.
Pause the video playback
Check if the player is paused or has yet to play
- true: if media is not currently playing
start media playback
Returns a Promise
if the browser returns one, for most browsers this will return undefined.
Gets or sets the current playback rate. A playback rate of 1.0 represents normal speed and 0.5 would indicate half-speed playback, for instance.
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
rate |
number | <optional> | New playback rate to set. |
The current playback rate when getting or 1.0
Get a TimeRange object representing the current ranges of time that the user has played.
A time range object that represents all the increments of time that have been played.
Return the Player that the Component
has attached to.
Get or set the poster image source url
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
src |
string | <optional> | Poster image source URL |
The current value of poster when getting
获取或设置preload属性
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
value |
boolean | <optional> |
|
获取时的preload属性值
将侦听器绑定到组件的就绪状态。 与事件侦听器不一样的是,若是ready事件已经发生,它将当即触发该功能。
返回本身; 方法能够连接。
从下面的列表中的代码返回一个值,表示当前呈现当前播放位置的元素的当前状态。
HAVE_NOTHING(数值0)没有关于媒体资源的信息可用。
HAVE_METADATA(数值1)已得到足够的资源,资源的持续时间可用。
HAVE_CURRENT_DATA(数值2)即时当前播放位置的数据可用。
HAVE_FUTURE_DATA(数值3)即时当前播放位置的数据可用,以及足够的数据供用户代理在播放方向上提早播放当前位置。
HAVE_ENOUGH_DATA(数值4)用户代理估计足够的数据可用于播放以不间断地继续。
当前播放渲染状态
计算视频中剩余多少时间。 不是原生视频API的一部分。
剩余时间以秒为单位
Get the remote HTMLTrackElementList tracks.
Remove an attribute from the Component
s element.
名称 | 类型 | 描述 |
---|---|---|
attribute |
string | Name of the attribute to remove. |
Remove a child Component
from this Component
s list of children. Also removes the child Component
s element from this Component
s element.
名称 | 类型 | 描述 |
---|---|---|
component |
Component | The child |
Remove a CSS class name from the Component
s element.
名称 | 类型 | 描述 |
---|---|---|
classToRemove |
string | CSS class name to remove |
Remove a remote TextTrack from the respective TextTrackList and HTMLTrackElementList.
名称 | 类型 | 描述 |
---|---|---|
track |
Object | Remote TextTrack to remove |
does not return anything
Report user activity
名称 | 类型 | 描述 |
---|---|---|
event |
Object | Event object |
Queues up a callback to be passed to requestAnimationFrame (rAF), but with a few extra bonuses:
Supports browsers that do not support rAF by falling back to Component#setTimeout.
The callback is turned into a Component~GenericCallback (i.e. bound to the component).
Automatic cancellation of the rAF callback is handled if the component is disposed before it is called.
名称 | 类型 | 描述 |
---|---|---|
fn |
Component~GenericCallback | A function that will be bound to this component and executed just before the browser's next repaint. |
Returns an rAF ID that gets used to identify the timeout. It can also be used in Component#cancelAnimationFrame to cancel the animation frame callback.
将视频的大小增长到全屏在某些浏览器中,全屏不被原生支持,所以进入“完整窗口模式”,视频填充浏览器窗口。 在支持原生全屏的浏览器和设备中,有时会显示浏览器的默认控件,而不是Video.js的自定义外观。 这包括大多数移动设备(iOS,Android)和较旧版本的Safari。
重置播放器. 加载techOrder的第一个技术,而且调用tech上的重置
返回用户是否正在“擦除”。 擦洗是当用户点击进度条手柄并沿着进度条拖动时。
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
isScrubbing |
boolean | <optional> | 用户是否擦除 |
获取时scrubbing的值
返回当前可用于寻找的媒体的TimeRanges。
媒体时间轴的可寻找间隔
返回玩家是否处于“寻求”状态。
若是玩家处于寻求状态,则为真,不然为假。
Select source based on tech-order or source-order Uses source-order selection if options.sourceOrder
is truthy. Otherwise, defaults to tech-order selection
名称 | 类型 | 描述 |
---|---|---|
sources |
Array | The sources for a media asset |
Object of source and tech order or false
Set the value of an attribute on the Component
's element
名称 | 类型 | 描述 |
---|---|---|
attribute |
string | Name of the attribute to set. |
value |
string | Value to set the attribute to. |
建立一个每x毫秒运行的函数。 这个函数是一个围绕window.setInterval的包装器。 用这个函数代替有如下缘由。
名称 | 类型 | 描述 |
---|---|---|
fn |
Component~GenericCallback | 每x秒运行一次的函数。 |
interval |
number | 每x毫秒执行指定的函数。 |
返回可用于标识interval的ID。 也能够在Component#clearInterval中使用它来清除间隔
Creates a function that runs after an x
millisecond timeout. This function is a wrapper around window.setTimeout
. There are a few reasons to use this one instead though:
建立在x毫秒超时后运行的函数。 这个函数是一个围绕window.setTimeout的包装器。 使用这个函数的一些缘由:
注意:您能够在此函数返回的id上使用window.clearTimeout。 这将使其dispose listene不被清理! 请使用Component#clearTimeout或Component#dispose。
名称 | 类型 | 描述 |
---|---|---|
fn |
Component~GenericCallback | 超时后运行的函数。 |
timeout |
number | 在执行指定功能以前延迟(以毫秒为单位)。 |
返回用于标识超时的超时ID。 它也能够在Component#clearTimeout中使用,以清除设置的超时。
Show the Component
s element if it is hidden by removing the 'vjs-hidden' class name from it.
The source function updates the video source There are three types of variables you can pass as the argument. URL string: A URL to the the video file. Use this method if you are sure the current playback technology (HTML5/Flash) can support the source you provide. Currently only MP4 files can be used in both HTML5 and Flash.
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
source |
Tech~SourceObject | Array.<Tech~SourceObject> | <optional> | One SourceObject or an array of SourceObjects |
The current video source when getting
检查当前的技术能够支持原生的全屏(例如,内置的控件,如iOS,因此不是咱们的Flash swf)
if native fullscreen is supported
Return a reference to the current Tech. It will print a warning by default about the danger of using the tech directly but any argument that is passed in will silence the warning.
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
safety |
* | <optional> | Anything passed in to silence the warning |
Get the TextTrackList
Get the remote TextTrackList
Add or remove a CSS class name from the component's element.
classToToggle
gets added when Component#hasClass would return false.classToToggle
gets removed when Component#hasClass would return true.名称 | 类型 | 属性 | 描述 |
---|---|---|---|
classToToggle |
string | The class to add or remove based on (@link Component#hasClass} |
|
predicate |
boolean | Dom~predicate | <optional> | An Dom~predicate function or a boolean |
returns a JavaScript object reperesenting the current track information. DOES not return it as JSON
Object representing the current of track info
触发此组件的全部就绪侦听器。
Get/set if user is active
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
bool |
boolean | <optional> |
|
The current value of userActive when getting
Toggle native controls on/off. Native controls are the controls built into devices (e.g. default iPhone controls), Flash, or other techs (e.g. Vimeo Controls) This should only be set by the current tech, because only the tech knows if it can support native controls
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
bool |
boolean | <optional> |
|
The current value of native controls when getting
Reports whether or not a player is using a plugin by name.
For basic plugins, this only reports whether the plugin has ever been initialized on this player.
名称 | 类型 | 描述 |
---|---|---|
name |
string | The name of a plugin. |
Whether or not this player is using the requested plugin.
Get video height
current video height
Get the VideoTrackList
Get video width
current video width
Get or set the current volume of the media
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
percentAsDecimal |
number | <optional> | The new volume as a decimal percent: - 0 is muted/0%/off - 1.0 is 100%/full - 0.5 is half volume or 50% |
The current volume as a percent when getting
A getter/setter for the Player
's width.
名称 | 类型 | 属性 | 描述 |
---|---|---|---|
value |
number | <optional> | The value to set the `Player's width to. |
The current width of the Player
when getting.
当音频/视频的加载停止时触发。
媒体具备 HAVE_FUTURE_DATA 或更大的readyState。
媒体具备HAVE_ENOUGH_DATA或更大的readyState。 这意味着整个媒体文件能够无缓冲播放。
调整组件大小时触发。
控制条禁用时触发。
控制条启用时触发。
播放器被销毁时调用。
播放时长被更改时调用。
当前播放列表为空时触发。
当媒体资源结束时触发 (currentTime == duration)
当运行enterFullWindow(浏览器不支持全屏时的全屏)方法时触发
发生错误是触发
当运行enterFullWindow(浏览器不支持全屏时的退出全屏)方法时触发,
首次播放视频时触发。 不是HLS规范的一部分,而且这可能不是最好的实现,因此使用谨慎。 若是你没有理由阻止播放,使用 myPlayer.one('play'); 代替。
在进入和退出全屏时触发。
当播放器已在当前播放位置数据加载完后时触发。
浏览器加载完成音频/视频的元数据时触发。(播放器获取初始持续时间和尺寸信息)
当用户代理开始查找媒体数据时触发。
每当媒体暂停时触发
每当发生Tech#play事件时触发。 表示播放已开始或恢复。
媒体再也不被阻止播放,并已开始播放。
表示插件刚刚在播放器上设置。
当海报图片在播放器上更改时,此事件触发。
在用户代理正在下载媒体数据时触发。
组件准备就绪时触发。
视频的内部尺寸更改时触发。
当播放器完成跳跃到新的时间时触发
当播放器跳到新的时间时触发
在浏览器尝试获取媒体数据时触发,但数据不可用。
当浏览器故意未获取媒体数据时触发。
当组件被点击时触发。
当咱们从tech获取textdata事件时触发
当前播放位置已更改时触发。在播放期间,每15 - 250毫秒触发一次,具体取决于使用的播放技术。
播放器正在使用自定义HTML控件时触发
播放器正在使用本地设备控件时触发
音量更改时触发
DOM元素上的readyState更改已致使播放中止。
若是属性不存在或没有值,大多数浏览器将返回null。