VideoTrackList: change イベント
change
イベントは、映像トラックがアクティブまたは非アクティブになったとき(トラックの selected
プロパティを変更したときなど)に発生します。
構文
このイベント名を addEventListener()
などのメソッドで使用するか、イベントハンドラープロパティを設定するかしてください。
addEventListener('change', (event) => { })
onchange = (event) => { }
イベント型
一般的な Event
で、追加のプロパティはありません。
例
addEventListener()
を使用する場合
const videoElement = document.querySelector('video');
videoElement.videoTracks.addEventListener('change', (event) => {
console.log(`'${event.type}' イベント発生`);
});
// `selected` の値を変更すると `change` イベントを引き起こします
const toggleTrackButton = document.querySelector('.toggle-track');
toggleTrackButton.addEventListener('click', () => {
const track = videoElement.videoTracks[0];
track.selected = !track.selected;
});
onchange
イベントハンドラープロパティを使用する場合
const videoElement = document.querySelector('video');
videoElement.videoTracks.onchange = (event) => {
console.log(`'${event.type}' イベント発生`);
};
// `selected` の値を変更すると `change` イベントを引き起こします
const toggleTrackButton = document.querySelector('.toggle-track');
toggleTrackButton.addEventListener('click', () => {
const track = videoElement.videoTracks[0];
track.selected = !track.selected;
});
仕様書
Specification |
---|
HTML Standard # event-media-change |
HTML Standard # handler-tracklist-onchange |
ブラウザーの互換性
BCD tables only load in the browser
関連情報
- 関連イベント:
addtrack
,removetrack
AudioTrackList
を対象としたこのイベント:change
- メディアキャプチャとストリーム API
- WebRTC