Руководство по HTML

Полный список тегов HTML

Событие ended DOM аудио/видео HTML

Если playback или streaming достигли конца媒体的 или нет больше данных, будет вызываться событие ended.

Онлайн пример

Сообщение о завершении воспроизведения аудио появится после его завершения:

Пример

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Использование события ended аудио/видео HTML - базовый курс (oldtoolbag.com)</title>
</head>
<body>
<p>Нажмите кнопку воспроизведения и подождите, пока аудио начнется</p>
<audio id="myAudio" controls>
　　<source src="horse.ogg" type="audio/ogg">
　　<source src="horse.mp3" type="audio/mpeg">
　　Ваш браузер не поддерживает элемент audio.
</audio>
<script>
var　aud　=　document.getElementById("myAudio");
aud.onended　=　function()　
{
　　　　alert("Аудио завершено воспроизведение");
};
</script>
</body>
</html>

Проверьте ‹/›

Определение и использование

Происходит событие end, когда аудио/видео достигает конца.
Это событие очень полезно для сообщений, таких как «Спасибо за прослушивание», «Спасибо за просмотр» и т.д.

Совместимость браузеров

IEFirefoxOperaChromeSafari

Синтаксис

В HTML:

<audio|video onended="myScript">Проверьте это

В JavaScript:

audio|video.onended=function(){myScript};Проверьте это

В JavaScript, используя метод addEventListener():

audio|video.addEventListener("ended", myScript);Проверьте это

Внимание: Браузеры Internet Explorer 8 и более ранние версии не поддерживают addEventListener() Методы.

Технические детали

Поддерживаемые теги HTML:	<audio> и <video>
Поддерживаемые объекты JavaScript:	Аудио, Видео

Онлайн пример

Сообщение о завершении воспроизведения видео появится после его завершения:

Пример

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Использование события ended аудио/видео HTML - базовый курс (oldtoolbag.com)</title>
</head>
<body>
<p>Нажмите кнопку воспроизведения и подождите, пока видео завершится.</p>
<video id="myVideo" width="320" height="176" controls>
　　<source src="movie.mp4" type="video/mp4">
　　<source src="movie.ogg" type="video/ogg">
　　Ваш браузер не поддерживает тег HTML5 video.
</video>
<script>
var vid = document.getElementById("myVideo");
vid.onended = function()　
{
　　　　alert("Видео завершено воспроизведение");
};
</script>
</body>
</html>

Проверьте ‹/›

Руководство по DOM аудио/видео HTML

HTML: <template> тег