mozilla

Revision 459333 of ProgressEvent

  • Revision slug: Web/API/ProgressEvent
  • Revision title: ProgressEvent
  • Revision id: 459333
  • Created:
  • Creator: teoli
  • Is current revision? No
  • Comment

Revision Content

{{eventref("Event")}}

The ProgressEvent interface represents events measuring progress of an underlying process, like an HTTP request (for an XMLHttpRequest, or the loading of the underlying resource of an {{HTMLElement("img")}}, {{HTMLElement("audio")}}, {{HTMLElement("video")}}, {{HTMLElement("style")}} or {{HTMLElement("link")}}).

Properties

Also inherits properties from its parent {{domxref("Event")}}.

{{domxref("ProgressEvent.lengthComputable")}} {{readonlyInline}}
Is a {{domxref("Boolean")}} flag indicating if the total work to be done, and the amount of work already done, by the underlying process is calculable. In other words, it tells if the progress is measurable or not.
{{domxref("ProgressEvent.loaded")}} {{readonlyInline}}
Is an unsigned long long representing the amount of work already performed by the underlying process. The ratio of work done can be calculated with the property and ProgressEvent.total. When downloading a resource using HTTP, this only represent the part of the content itself, not headers and other overhead.
{{domxref("ProgressEvent.total")}} {{readonlyInline}}
Is an unsigned long long representing the total amount of work that the underlying process is in the progress of performing. When downloading a resource using HTTP, this only represent the content itself, not headers and other overhead.

Constructor

{{domxref("ProgressEvent.ProgressEvent", "ProgressEvent()")}}
Creates a ProgressEvent event with the given parameters.

Methods

Also inherits methods from its parent {{domxref("Event")}}.

{{domxref("ProgressEvent.initProgressEvent()")}} {{deprecated_inline}}{{non-Standard_inline}}
Initializes a ProgressEvent created using the deprecated {{domxref("Document.createEvent()", "Document.createEvent(\"ProgressEvent\")")}} method.

Specifications

Specification Status Comment
{{SpecName('Progress Events', '#interface-progressevent', 'ProgressEvent')}} {{Spec2('Progress Events')}} Initial definition.

Browser compatibility

{{CompatibilityTable}}

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support {{CompatVersionUnknown}} {{CompatGeckoDesktop("1.9.1")}} {{CompatVersionUnknown}} {{CompatVersionUnknown}} {{CompatVersionUnknown}}
initProgressEvent() {{CompatNo}} {{CompatGeckoDesktop("1.9.1")}}
Removed in {{CompatGeckoDesktop("22")}}
{{CompatVersionUnknown}} {{CompatNo}} {{CompatNo}}
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support {{CompatVersionUnknown}} {{CompatGeckoMobile("1.9.1")}} {{CompatVersionUnknown}} {{CompatVersionUnknown}} {{CompatVersionUnknown}}
initProgressEvent() {{CompatNo}} {{CompatGeckoMobile("1.9.1")}}
Removed in {{CompatGeckoMobile("22")}}
{{CompatVersionUnknown}} {{CompatNo}} {{CompatNo}}

See also

  • The {{domxref("Event")}} base interface.

Revision Source

<p>{{eventref("Event")}}</p>
<p>The <strong><code>ProgressEvent</code></strong> interface represents events measuring progress of an underlying process, like an HTTP request (for an <code>XMLHttpRequest</code>, or the loading of the underlying resource of an {{HTMLElement("img")}}, {{HTMLElement("audio")}}, {{HTMLElement("video")}}, {{HTMLElement("style")}} or {{HTMLElement("link")}}).</p>
<h2 id="Properties">Properties</h2>
<p><em>Also inherits properties from its parent {{domxref("Event")}}</em>.</p>
<dl>
  <dt>
    {{domxref("ProgressEvent.lengthComputable")}} {{readonlyInline}}</dt>
  <dd>
    Is a {{domxref("Boolean")}} flag indicating if the total work to be done, and the amount of work already done, by the underlying process is calculable. In other words, it tells if the progress is measurable or not.</dd>
  <dt>
    {{domxref("ProgressEvent.loaded")}} {{readonlyInline}}</dt>
  <dd>
    Is an <code>unsigned long long</code> representing the amount of work already performed by the underlying process. The ratio of work done can be calculated with the property and <code>ProgressEvent.total</code>. When downloading a resource using HTTP, this only represent the part of the content itself, not headers and other overhead.</dd>
  <dt>
    {{domxref("ProgressEvent.total")}} {{readonlyInline}}</dt>
  <dd>
    Is an <code>unsigned long long</code> representing the total amount of work that the underlying process is in the progress of performing. When downloading a resource using HTTP, this only represent the content itself, not headers and other overhead.</dd>
</dl>
<h2 id="Constructor">Constructor</h2>
<dl>
  <dt>
    {{domxref("ProgressEvent.ProgressEvent", "ProgressEvent()")}}</dt>
  <dd>
    Creates a <code>ProgressEvent</code> event with the given parameters.</dd>
</dl>
<h2 id="Methods">Methods</h2>
<p><em>Also inherits methods <em>from its parent {{domxref("Event")}}.</em></em></p>
<dl>
  <dt>
    {{domxref("ProgressEvent.initProgressEvent()")}} {{deprecated_inline}}{{non-Standard_inline}}</dt>
  <dd>
    Initializes a <code>ProgressEvent</code> created using the deprecated {{domxref("Document.createEvent()", "Document.createEvent(\"ProgressEvent\")")}} method.</dd>
</dl>
<h2 id="Specifications">Specifications</h2>
<table class="standard-table">
  <tbody>
    <tr>
      <th scope="col">Specification</th>
      <th scope="col">Status</th>
      <th scope="col">Comment</th>
    </tr>
    <tr>
      <td>{{SpecName('Progress Events', '#interface-progressevent', 'ProgressEvent')}}</td>
      <td>{{Spec2('Progress Events')}}</td>
      <td>Initial definition.</td>
    </tr>
  </tbody>
</table>
<h2 id="Browser_compatibility">Browser compatibility</h2>
<p>{{CompatibilityTable}}</p>
<div id="compat-desktop">
  <table class="compat-table">
    <tbody>
      <tr>
        <th>Feature</th>
        <th>Chrome</th>
        <th>Firefox (Gecko)</th>
        <th>Internet Explorer</th>
        <th>Opera</th>
        <th>Safari</th>
      </tr>
      <tr>
        <td>Basic support</td>
        <td>{{CompatVersionUnknown}}</td>
        <td>{{CompatGeckoDesktop("1.9.1")}}</td>
        <td>{{CompatVersionUnknown}}</td>
        <td>{{CompatVersionUnknown}}</td>
        <td>{{CompatVersionUnknown}}</td>
      </tr>
      <tr>
        <td><code>initProgressEvent()</code></td>
        <td>{{CompatNo}}</td>
        <td>{{CompatGeckoDesktop("1.9.1")}}<br />
          Removed in {{CompatGeckoDesktop("22")}}</td>
        <td>{{CompatVersionUnknown}}</td>
        <td>{{CompatNo}}</td>
        <td>{{CompatNo}}</td>
      </tr>
    </tbody>
  </table>
</div>
<div id="compat-mobile">
  <table class="compat-table">
    <tbody>
      <tr>
        <th>Feature</th>
        <th>Android</th>
        <th>Firefox Mobile (Gecko)</th>
        <th>IE Mobile</th>
        <th>Opera Mobile</th>
        <th>Safari Mobile</th>
      </tr>
      <tr>
        <td>Basic support</td>
        <td>{{CompatVersionUnknown}}</td>
        <td>{{CompatGeckoMobile("1.9.1")}}</td>
        <td>{{CompatVersionUnknown}}</td>
        <td>{{CompatVersionUnknown}}</td>
        <td>{{CompatVersionUnknown}}</td>
      </tr>
      <tr>
        <td><code>initProgressEvent()</code></td>
        <td>{{CompatNo}}</td>
        <td>{{CompatGeckoMobile("1.9.1")}}<br />
          Removed in {{CompatGeckoMobile("22")}}</td>
        <td>{{CompatVersionUnknown}}</td>
        <td>{{CompatNo}}</td>
        <td>{{CompatNo}}</td>
      </tr>
    </tbody>
  </table>
</div>
<h2 id="See_also">See also</h2>
<ul>
  <li>The {{domxref("Event")}} base interface.</li>
</ul>
Revert to this revision