JQuery 循环遍历所有文件输入字段以获取大小

Dar*_*dro 5 javascript jquery

我正在尝试遍历所有文件输入字段并设置错误消息(如果有任何超过 5MB)作为表单验证的第一步。

我在提交按钮上使用点击事件。问题是“键”没有定义。

此表单最多可以有 10 个文件输入字段,通过 AJAX 添加,称为 images[]

        /* loop through all file inputs to check size */
        $("#my-form").find("input[type='file']").each(function(key, value) {
            var el = this.files[key];
            if(el.size > 5242880 || el.fileSize > 5242880) {
                errorMessage = 'Files must be less than 5MB.';
            }
        });
Run Code Online (Sandbox Code Playgroud)

如果我使用,this.files[0]我可以获得第一个字段的大小,但在遍历所有元素时遇到问题。感谢您的输入或其他解决方案。非常感谢!

Roc*_*cky 8

你可以这样做

$("#my-form").find("input[type=file]").each(function(index, field){
   const file = field.files[0];
   if(file.size > 5242880 || file.fileSize > 5242880) {
      errorMessage = 'Files must be less than 5MB.';
   }
});
Run Code Online (Sandbox Code Playgroud)

这是一个小提琴:https : //jsfiddle.net/kmm67nLz/

对于具有多个属性的文件输入

$("#my-form").find("input[type=file]").each(function(index, field){
  for(var i=0;i<field.files.length;i++) {
    const file = field.files[i];
    if(file.size > 5242880 || file.fileSize > 5242880) {
      errorMessage = 'Files must be less than 5MB.';
      alert(errorMessage);
    }
  }
});
Run Code Online (Sandbox Code Playgroud)

这是一个小提琴:https : //jsfiddle.net/kmm67nLz/1/

第二个非常适合用于任何单个或多个文件输入。