Videojs.com

Video.js 指南

这些指南涵盖了 Video.js 用户的各种主题

返回指南

事件目标

目录

概述

Video.js 中的事件被设置为模仿用于对象的 DOM API，但也提供具有相同功能的实用简写函数。

on() 和 addEventListener()

此函数用于向 EventTarget 添加事件监听器。

var foo = new EventTarget();
var handleBar = function() {
  console.log('bar was triggered');
};

foo.on('bar', handleBar);

// This causes any `event listeners` for the `bar` event to get called
// see {@link EventTarget#trigger} for more information
foo.trigger('bar');
// logs 'bar was triggered'

off() 和 removeEventListener()

此函数用于从 EventTarget 移除监听函数。

var foo = new EventTarget();
var handleBar = function() {
  console.log('bar was triggered');
};

// adds an `event listener` for the `bar` event
// see {@link EventTarget#on} for more info
foo.on('bar', handleBar);

// runs all `event listeners` for the `bar` event
// see {@link EventTarget#trigger} for more info
foo.trigger('bar');
// logs 'bar was triggered'

foo.off('bar', handleBar);
foo.trigger('bar');
// does nothing

one()

此函数用于使事件监听器仅被调用一次，之后不再调用。

使用 on() 和 off() 来模拟 one() (不推荐)

var foo = new EventTarget();
var handleBar = function() {
  console.log('bar was triggered');
  // after the first trigger remove this handler
  foo.off('bar', handleBar);
};

foo.on('bar', handleBar);
foo.trigger('bar');
// logs 'bar was triggered'

foo.trigger('bar');
// does nothing

使用 one()

var foo = new EventTarget();
var handleBar = function() {
  console.log('bar was triggered');
};

// removed after the first trigger
foo.one('bar', handleBar);
foo.trigger('bar');
// logs 'bar was triggered'

foo.trigger('bar');
// does nothing

trigger() 和 dispatchEvent()

此函数用于在 EventTarget 上触发事件，这将导致所有监听器运行。

注意：如果 'click' 在 EventTarget.allowedEvents_ 中，则 trigger 将尝试调用 onClick 函数（如果存在）。

var foo = new EventTarget();
var handleBar = function() {
  console.log('bar was triggered');
};

foo.on('bar', handleBar);
foo.trigger('bar');
// logs 'bar was triggered'

foo.trigger('bar');
// logs 'bar was triggered'

foo.trigger('foo');
// does nothing