1 概要
1.
2. このアプリケーションは、
3. リスナーを ontimeupdate イベントにバインドすることで、オーディオとビデオの再生位置をリアルタイムで監視できます。
2つのコード
<!DOCTYPE html> <html> <head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org)" /> <meta http-equiv="Content-Type" content="text/html; charset=GBK" /> <title> 视频播放 </title> </head> <body> <h2> 视频播放 </h2> <video id="mv" src="movie.webm" loop> 您的浏览器不支持video元素 </video><br/> <input id="bn" type="button" value="播放"/><span id="detail"></span>秒 <script type="text/javascript"> var bn = document.getElementById("bn"); var mv = document.getElementById("mv"); var detail = document.getElementById("detail"); // 为video元素的ontimeupdate事件绑定监听器 mv.ontimeupdate = function() { detail.innerHTML = mv.currentTime + "/" + mv.duration; }; bn.onclick = function() { if(mv.paused) { mv.play(); bn.value = "暂停"; } else { mv.pause(); bn.value = "播放"; } } </script> </body> </html>
3つの実行結果
以上がHTML5 でのオーディオおよびビデオ リスナー アプリケーションの例の詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。