HTMLリファレンスマニュアル

HTMLタグ一覧

HTML オーディオ/ビデオDOM progressイベント

ブラウザがリソースを読み込むとき、定期的にprogressイベントがトリガーされます。

オンラインの例

ビデオがダウンロード中のアラート：

例

<!DOCTYPE　html>
<html>
<head>
<meta　charset="utf-8">
<title>HTML　オーディオ/ビデオ　onprogress　イベントの使用-基本チュートリアル(oldtoolbag.com)</title>
</head>
<body>
<video　id="video1"　controls="controls">
　　<source　src="movie.mp4"　type="video/mp4">
　　<source　src="movie.ogg"　type="video/ogg">
　　あなたのブラウザはHTML5　video　タグ。
</video>
<script>
myVid=document.getElementById("video1");
myVid.onprogress=alert("ビデオのダウンロード中");
</script>　
</body>
</html>

テストを見てみましょう ‹/›

定義と使用法

ブラウザが指定されたオーディオをダウンロードしているとき/ビデオのとき、進行イベントが発生します。
オーディオ/ビデオの読み込み中には、以下の順番で以下のイベントが発生します：

ブラウザの互換性

IEFirefoxOperaChromeSafari

すべての主要ブラウザは progress イベントをサポートしています。

注意：Internet Explorer 8 及びその以前のバージョンでは、このイベントをサポートしていません。

文法

HTML で：

<audio|video onprogress="SomeJavaScriptCode">

JavaScript で：

audio|video.onprogress=SomeJavaScriptCode;

addEventListener() を使用

audio|video.addEventListener("progress", function()
　 {
　 //SomeJavaScriptCode
　 }
);

技術的詳細

以下の HTML タグがサポートされています：	<audio>, <video>
以下の JavaScript オブジェクトがサポートされています：	オーディオ、ビデオ

さらに例

HTML エレメント上で onprogress 属性を使用

addEventListener() を使用して progress イベントをリスン

　HTML オーディオ/ビデオ DOM リファレンスマニュアル

HTML: <template> タグ