监测数据传输进度

新版本的XMLHttpRequest对象新增一个progress事件，用来返回进度信息。它分成上传和下载两种情况。下载的progress事件属于XMLHttpRequest对象，上传的progress事件属于XMLHttpRequest.upload对象。

第1步，先定义progress事件的回调函数。

xhr.onprogress =  updateProgress;
xhr.upload.onprogress =  updateProgress;

第2步，在回调函数里面，使用这个事件的一些属性。

function  updateProgress(event) {
　　if (event.lengthComputable) {
　　　　var percentComplete = event.loaded / event.total;
　　} 
}

上面的代码中，event.total是需要传输的总字节，event.loaded是已经传输的字节。如果event.lengthComputable不为真，则event.total等于0。

与progress事件相关的，还有其他五个事件，可以分别指定回调函数：

• load：传输成功完成。
• abort：传输被用户取消。
• error：传输中出现错误。
• loadstart：传输开始。
• loadEnd：传输结束，但是不知道成功还是失败。