客户端使用HTML5检查文件大小？

我正在尝试搭乘HTML5 wave，但我正面临一个小问题。在HTML5之前，我们正在使用Flash检查文件大小，但现在趋势是避免在Web应用程序中使用Flash。有什么方法可以使用HTML5检查客户端的文件大小吗？客户端使用HTML5检查文件大小？

来源

2010-11-06 Khaled Musaied

114

这工作。当输入发生变化时，将其放置在事件监听器中。

if (typeof FileReader !== "undefined") { 
    var size = document.getElementById('myfile').files[0].size; 
    // check file size 
}

来源

2010-11-29 20:38:39

它适用于IE 10，Mozilla FFx和Chrome。谢谢！ – Rahnzo 2014-12-10 13:36:40

在Chrome中不适用于我？ https://jsfiddle.net/ffyvbm27/ – 2015-07-17 17:41:24

工作正常，你只是没有正确使用它;登录输入的onchange事件，你会没事的。 – dandavis 2015-07-18 20:34:39

“没有简单的，跨浏览器的解决方案来实现这一目标”：Detecting file upload size on the client side?

来源

2010-11-06 09:35:40 Julien

添加服务器验证尺寸为好，但你还不如保存那些具有现代浏览器的痛苦和检查客户端以及。 – 2011-03-21 06:25:56

HTML5 fie api支持检查文件大小。

阅读这篇文章，以获取有关文件API

http://www.html5rocks.com/en/tutorials/file/dndfiles/

<input type="file" id="fileInput" /> 


var size = document.getElementById("fileInput").files[0].size;

类似文件的API提供的名称和类型的详细信息。

来源

2012-08-31 05:27:55

Uploadify可以使用HTML5上传文件。还有一个Flash版本。

你可以设置文件大小的限制，与“fileSizeLimit”参数。

来源

2013-01-09 04:27:47

接受的答案实际上是正确的，但你需要将其绑定到一个事件侦听器，以便不断输入的文件被更改，将更新时。

document.getElementById('fileInput').onchange = function(){ 
    var filesize = document.getElementById('fileInput').files[0].size; 
    console.log(filesize);  
}

如果您正在使用jQuery库，然后将下面的代码可能会派上用场

$('#fileInput').on('change',function(){ 
    if($(this).get(0).files.length > 0){ // only if a file is selected 
    var fileSize = $(this).get(0).files[0].size; 
    console.log(fileSize); 
    } 
});

鉴于档案大小的转换，以显示其曾经指标是你。

来源

2015-07-20 18:53:56 Ammadu

你的jQuery示例不起作用。你似乎不能用'.files'来使用jQuery：https：//jsfiddle.net/edxvo4wa/（当我想出一个解决方案时，我自己发现了这个 - 如果你把它改为' document.getElementById'）。 – 2015-07-21 10:22:12

@Chuck对不起，有错误，我已经更新了我的答案与工作之一 – Ammadu 2015-07-21 10:28:59

就个人而言，我会选择以下格式：

$('#inputFile').bind('change', function(e) { 
     var data = e.originalEvent.target.files[0]; 
     // and then ... 
     console.log(data.size + "is my file's size"); 
     // or something more useful ... 
     if(data.size < 500000) { 
     // what your < 500kb file will do 
     } 
    }

来源

2016-10-04 14:52:46

客户端使用HTML5检查文件大小？

回答

相关问题