为什么即使对于大文件(几MB),我的progress
侦听器也只能被调用一次?
我的示例代码:
let form = document.getElementById('form');
let fileInput = form.elements['file'];
fileInput.addEventListener('change', function() {
let file = fileInput.files[0];
let request = new XMLHttpRequest();
request.addEventListener('progress', function(e) {
let p = e.lengthComputable ? (e.loaded/e.total*100) : 0;
console.log('Download progress: ' + p);
});
request.upload.addEventListener('progress', function(e) {
let p = e.lengthComputable ? (e.loaded/e.total*100) : 0;
console.log('Upload progress: ' + p);
});
let formData = new FormData();
formData.append('file', file, file.name);
request.open('POST', form.action);
request.send(formData);
});
HTML:
<form
id="form"
action="http://192.168.0.186:5000/upload.php"
>
<input name="file" type="file" multiple accept="image/*">
</form>
控制台中的输出:
Upload progress: 100
Download progress: 0