Как не запускать видео законченное событие, когда у него есть EventListener
У меня есть веб-страница с тремя небольшими html5-видео. Когда эта часть страницы загружает первое воспроизведение видео, затем, когда оно заканчивается, воспроизводится второе видео, а когда заканчивается второе, воспроизводится третье. Я сделал это с addEventListener для "закончилась". Мой код выглядит так:
//first video
var player1=document.getElementById('firstVideo');
player1.addEventListener('ended',vidHandlerLow,false);
//second video
var player2=document.getElementById('secondVideo');
player2.addEventListener('ended',vidHandlerMedium,false);
//third video
var player3=document.getElementById('thirdVideo');
player3.addEventListener('ended',vidHandlerHigh,false);
player1.play();
function vidHandlerLow() {
player1.pause();
player2.play();
}
function vidHandlerMedium() {
player2.pause();
player3.play();
}
function vidHandlerHigh() {
player3.pause();
}
Проблема, с которой я столкнулся, заключается в том, что я пытаюсь воспроизвести одно видео при наведении, не вызывая завершенное событие, которое будет воспроизводить остальное. Я пытался:
onmouseover="this.removeEventListener('ended'); this.play();"
Но законченное событие все еще вызвано. Если я наведу курсор мыши на видео1, то видео1 будет воспроизводиться, а затем два и три, когда должно воспроизводиться только видео с задержкой. Какие-нибудь предложения, как воспроизвести одно видео без запуска видео?
1 ответ
Поскольку мне нужно, чтобы видео воспроизводилось автоматически только после того, как я смог удалить прослушиватели событий в функциях, которые я вызываю "завершено", вот так:
function vidHandlerLow() {
player1.pause();
player1.removeEventListener('ended', vidHandlerLow);
player2.play();
}