Baru -baru ini, saya sedang mengerjakan proyek yang memerlukan pemantauan acara pemutaran video dan dapat mencetak log log. Setelah beberapa pemikiran, saya menerapkan fungsi ini menggunakan JavaScript, dan kodenya adalah sebagai berikut:
Html:
Salinan kode adalah sebagai berikut:
<! Doctype html>
<Html>
<head>
<meta http-equiv = "konten tipe" content = "text/html; charset = utf-8">
<title> multi source </iteme>
</head>
<body>
<Video src = "http://www.w3school.com.cn/i/movie.mp4" mengontrol autoplay> </dide>
<Video src = "http://www.w3school.com.cn/i/movie.mp4" mengontrol autoplay> </dide>
<Video src = "http://www.w3school.com.cn/i/movie.mp4" mengontrol autoplay> </dide>
<Video src = "http://www.w3school.com.cn/i/movie.mp4" mengontrol autoplay> </dide>
<Video src = "http://www.w3school.com.cn/i/movie.mp4" mengontrol autoplay> </dide>
<Video src = "http://www.w3school.com.cn/i/movie.mp4" mengontrol autoplay> </dide>
<Video src = "http://www.w3school.com.cn/i/movie.mp4" mengontrol autoplay> </dide>
<Video src = "http://www.w3school.com.cn/i/movie.mp4" mengontrol autoplay> </dide>
<Video src = "http://www.w3school.com.cn/i/movie.mp4" mengontrol autoplay> </dide>
<Video src = "http://www.w3school.com.cn/i/movie.mp4" mengontrol autoplay> </dide>
<Video src = "http://www.w3school.com.cn/i/movie.mp4" mengontrol autoplay> </dide>
</body>
</html>
JS:
Salinan kode adalah sebagai berikut:
<type skrip = "Teks/JavaScript">
window.addeventlistener ("muat", getVideoVent);
fungsi getVideoVent () {
var video = document.geteLementsByTagname ("video");
untuk (var i = 0; i <videos.length; i ++) {
showeventlog ("video"+(i+1), video [i]);
}
}
fungsi showeventlog (videonum, media) {
EventTester = function (e) {
Media.addeventListener (e, function () {
console.log (videonum+":"+e);
});
}
EventTester ("LoadStart"); // Klien mulai meminta data
EventTester ("Progress"); // Klien meminta data
EventTester ("Suspend"); // Unduh yang tertunda
EventTester ("Abort"); // Klien secara aktif mengakhiri unduhan (bukan disebabkan oleh kesalahan),
EventTester ("Kesalahan"); // Kesalahan ditemui saat meminta data
Eventtester ("Stalled"); // Hentikan kecepatan jaringan
EventTester ("Play"); // dipicu saat bermain () dan autoplay mulai bermain
EventTester ("jeda"); // jeda () pemicu
EventTester ("LoadedMetadata"); // berhasil mendapatkan panjang sumber daya
EventTester ("LoadedData"); //
EventTester ("Waiting"); // menunggu data, bukan kesalahan
EventTester ("Playing"); // Mulai pemutaran
EventTester ("CanPlay"); // dapat bermain, tetapi mungkin dijeda karena pemuatan di tengah
EventTester ("CanPlaythrough"); // dapat diputar, semua lagu dimuat
EventTester ("mencari"); // pencarian
EventTester ("Dicari"); // Pencarian selesai
EventTester ("TimeUpdate"); // Perubahan Waktu Playback
EventTester ("diakhiri"); // Pemutaran berakhir
EventTester ("Ratechange"); // Tingkat pemutaran berubah
EventTester ("Durasione"); // perubahan panjang sumber daya
EventTester ("VolumeChange"); // Perubahan Volume
}
</script>
Teman, silakan baca ide -ide dalam artikel ini, saya harap ini akan membantu Anda