Недавно я работаю над проектом, который требует мониторинга событий воспроизведения видео и возможности печатать журналы журнала. После некоторой мысли я реализовал эту функцию, используя JavaScript, и код выглядит следующим образом:
HTML:
Кода -копия выглядит следующим образом:
<! Doctype html>
<html>
<голова>
<meta http-equiv = "content-type" content = "text/html; charset = utf-8">
<title> Multi Source </title>
</head>
<тело>
<Видео src = "http://www.w3school.com.cn/i/movie.mp4" управляет Autoplay> </video>
<Видео src = "http://www.w3school.com.cn/i/movie.mp4" управляет Autoplay> </video>
<Видео src = "http://www.w3school.com.cn/i/movie.mp4" управляет Autoplay> </video>
<Видео src = "http://www.w3school.com.cn/i/movie.mp4" управляет Autoplay> </video>
<Видео src = "http://www.w3school.com.cn/i/movie.mp4" управляет Autoplay> </video>
<Видео src = "http://www.w3school.com.cn/i/movie.mp4" управляет Autoplay> </video>
<Видео src = "http://www.w3school.com.cn/i/movie.mp4" управляет Autoplay> </video>
<Видео src = "http://www.w3school.com.cn/i/movie.mp4" управляет Autoplay> </video>
<Видео src = "http://www.w3school.com.cn/i/movie.mp4" управляет Autoplay> </video>
<Видео src = "http://www.w3school.com.cn/i/movie.mp4" управляет Autoplay> </video>
<Видео src = "http://www.w3school.com.cn/i/movie.mp4" управляет Autoplay> </video>
</body>
</html>
JS:
Кода -копия выглядит следующим образом:
<script type = "text/javascript">
window.addeventListener ("Load", GetVideoEvent);
function getVideoEvent () {
var Videos = document.getElementsBytagName ("Видео");
for (var i = 0; i <video.length; i ++) {
ShowEventLog ("Видео"+(i+1), видео [i]);
}
}
Функция ShowEventLog (Videonum, Media) {
EventTester = function (e) {
Media.addeventlistener (e, function () {
console.log (Videonum+":"+e);
});
}
EventTester ("LoadStart"); // клиент начинает запрашивать данные
EventTester («Прогресс»); // клиент запрашивает данные
EventTester («Приостановка»); // Задержка скачивания
EventTester («прервать»); // Клиент активно завершает загрузку (не вызвана ошибкой),
EventTester ("ошибка"); // была обнаружена ошибка при запросе данных
EventTester ("Застопорился"); // Остановить скорость сети
EventTester ("Play"); // запускается, когда Play () и Autoplay начинают играть
EventTester ("пауза"); // Пауза () Триггеры
EventTester ("LoadedMetadata"); // успешно получить длину ресурса
EventTester ("LoadedData"); //
EventTester («ожидание»); // ожидание данных, а не ошибка
EventTester («игра»); // начать воспроизведение
EventTester ("canplay"); // может играть, но может быть приостановлен из -за загрузки в середине
EventTester ("canPlayThrough"); // можно сыграть, все песни загружены
EventTester («поиск»); //Идет поиск
EventTester («Seeked»); // Поиск завершен
EventTester ("TimeUpdate"); // Изменения времени воспроизведения
EventTester («закончился»); // заканчивается воспроизведение
EventTester ("RateChange"); // Изменения скорости воспроизведения
EventTester ("DurationChange"); // Изменения длины ресурса
EventTester ("VolumeChange"); // изменение объема
}
</script>
Друзья, пожалуйста, прочитайте идеи в этой статье, я надеюсь, что это будет полезно для вас