Question

我有一个可以有多个文件输入的表单（每个输入一个文件，而不是多选）。

当我提交表单时，如何获取所有input[type="file"]内容的数组并使用FileReader在上传之前查看文件大小，如果任何文件太大，请阻止它？< / p>

$('#MyForm').submit(function() {

});

我无法从我能找到的有限FileReader文档中弄清楚这一点。无论如何......或者不让它工作......

Answer 1

问题是我试图用jQuery从文件输入中选择文件的方式。以下是一些示例解决方案：

如果您输入了一个文件，并且用户只能选择一个文件：

// Get the file
var file = $('input[type="file"]').get(0).files[0];

// File size, in bytes
var size = file.size;

如果您有一个文件输入，请选择多个文件：

// Get an array of the files
var files = $('input[type="file"]').get(0).files;

// Loop through files
for (var i=0; file = files[i]; i++) {

    // File size, in bytes
    var size = file.size;
}

如果您有多个文件输入，请选择多个文件：

// Loop through each file input
$('input[type="file"]').each(function(i) {

    // Get an array of the files for this input
    var files = $(this).get(0).files;

    // Loop through files
    for (var j=0; file = files[j]; j++) {

        // File size, in bytes
        var size = file.size;
    }
});

获得File对象后，您可以访问以下属性（除了大小）：

https://developer.mozilla.org/en-US/docs/DOM/File#Properties

Answer 2

您正在寻找size财产：

var anyOversize =
    Array.prototype.some.call(document.querySelectorAll('input[type="file"]'), function(fileInput) {
        return Array.prototype.some.call(fileInput.files, function(file) {
            return file.size > limit;
        });
    });

（顺便说一下，这是以字节为单位的大小。）

在表单提交上，检查准备上传的文件大小？

2 个答案: