ProgressEvent
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
io error: No such file or directory (os error 2) (/home/runner/work/yari/yari/mdn/translated-content/files/zh-cn/web/api/xmlhttprequest_api/index.md)
ProgressEvent
接口是测量如 HTTP 请求(一个XMLHttpRequest
,或者一个 <img>
,<audio>
,<video>
,<style>
或 <link>
等底层资源的加载)等底层流程进度的事件。
构造方法
ProgressEvent()
-
用给定的参数创建一个
ProgressEvent
事件。
属性
同时继承它的父元素 Event
的属性。
ProgressEvent.lengthComputable
只读-
是一个
Boolean
标志,表示底层流程将需要完成的总工作量和已经完成的工作量是否可以计算。换句话说,它告诉我们进度是否可以被测量。 ProgressEvent.loaded
只读-
是一个
unsigned long long
类型数据,表示底层流程已经执行的工作总量。可以用这个属性和ProgressEvent.total
计算工作完成比例。当使用 HTTP 下载资源,它只表示内容本身的部分,不包括首部和其他开销。 ProgressEvent.total
只读-
是一个
unsigned long long
类型数据,表示正在执行的底层流程的工作总量。当使用 HTTP 下载资源,它只表示内容本身的部分,不包括首部和其他开销。
方法
同时继承它的父元素 Event
的方法。
ProgressEvent.initProgressEvent()
已弃用 非标准-
使用被弃用的
Document.createEvent("ProgressEvent")
方法,来初始化一个已经创建好的ProgressEvent
。
示例
下面的示例为一个新建的 XMLHTTPRequest
添加了一个 ProgressEvent
,并使用它来显示请求状态。
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
相关链接
- The
Event
base interface.