在上传过程中检查文件大小并停止使用javascript超过文件大小限制上传？

Question

有没有一种方法来使用JavaScript或jQuery来检查文件上传的进度（即服务器已经收到多少字节或几千字节），并且如果超过一定限制则切断上传，向用户显示警告/错误信息？谢谢。

Answer 1

这个例子可以帮助你：http://js1.hotblocks.nl/tests/ajax/file-drag-drop.html

（其中还包括拖/放接口，但是这很容易被忽略。）

基本上它归结为是这样的：

<input id=files type=file> 

<script> 
document.getElementById('files').addEventListener('change', function(e) { 
    var file = this.files[0]; 
    var xhr = new XMLHttpRequest(); 
    xhr.file = file; // not necessary if you create scopes like this 
    xhr.addEventListener('progress', function(e) { 
     var done = e.position || e.loaded, total = e.totalSize || e.total; 
     console.log('xhr progress: ' + (Math.floor(done/total*1000)/10) + '%'); 
    }, false); 
    if (xhr.upload) { 
     xhr.upload.onprogress = function(e) { 
      var done = e.position || e.loaded, total = e.totalSize || e.total; 
      console.log('xhr.upload progress: ' + done + '/' + total + ' = ' + (Math.floor(done/total*1000)/10) + '%'); 
     }; 
    } 
    xhr.onreadystatechange = function(e) { 
     if (4 == this.readyState) { 
      console.log(['xhr upload complete', e]); 
     } 
    }; 
    xhr.open('post', url, true); 
    xhr.send(file); 
}, false); 
</script> 

在进度方法你得到的文件大小等，我希望这解决了你的问题。 此致敬礼。