ProgressEvent

ProgressEvent インターフェイスは、プロセスの進捗、例えば HTTP リクエスト(XMLHttpRequest、または <img>, <audio>, <video>, <style>, <link> のような基本的なリソースの読み込み)などを計測するイベントを表します。

Event ProgressEvent

コンストラクター

ProgressEvent()

指定した引数で ProgressEvent イベントを作成します。

プロパティ

親である Event から継承したプロパティもあります。

ProgressEvent.lengthComputable 読取専用

論理値のフラグで、基礎となるプロセスで行われる作業の合計と、既に行われた作業の量が計算可能かどうかを示します。言い換えれば、進捗が測定可能かどうかを示します。

ProgressEvent.loaded 読取専用

64 ビット符号なし整数値で、基礎となるプロセスで既に実行された作業の量を示す。行われた作業の比率は、 total でこのプロパティの値を割ることで計算できます。 HTTP を使用してリソースをダウンロードする場合、これは HTTP メッセージの本文のみをカウントし、ヘッダーやその他のオーバーヘッドは含まれません。

ProgressEvent.total 読取専用

64 ビット符号なし整数で、基礎となるプロセスが実行中の作業の総量を表す。 HTTP でリソースをダウンロードする場合、これは Content-Length (メッセージの本文のサイズ)であり、ヘッダーやその他のオーバーヘッドは含まれません。

メソッド

親である Event から継承したメソッドもあります。

ProgressEvent.initProgressEvent() Deprecated Non-Standard

非推奨の Document.createEvent("ProgressEvent") メソッドを使用して生成された ProgressEvent を初期化します。

以下の例は ProgressEvent を新しい XMLHTTPRequest に追加し、リクエストの状態を表示するために使用します。

var progressBar = document.getElementById("p"),
    client = new XMLHttpRequest()
client.open("GET", "magical-unicorns")
client.onprogress = function(pe) {
  if(pe.lengthComputable) {
    progressBar.max = pe.total
    progressBar.value = pe.loaded
  }
}
client.onloadend = function(pe) {
  progressBar.value = pe.loaded
}
client.send()

仕様書

Specification
XMLHttpRequest Standard
# interface-progressevent

ブラウザーの互換性

BCD tables only load in the browser

関連情報

  • 基本インターフェイスの Event