使用 javascript 进行多文件验证

Question

我正在尝试通过

上传多个文件

<input type="file" id="uploadFiles" multiple onchange="checkFileUploadExt(this);"/>

使用 javascript

function checkFileUploadExt(fieldObj)
{
    var control = document.getElementById("uploadFiles");
    var filelength = control.files.length;
    var FileName = fieldObj.value;
    var FileExt = FileName.substr(FileName.lastIndexOf('.') + 1);       
    if ((FileExt.toUpperCase() != "PDF"))
        if ((FileExt !== "pdf") || (FileExt !== "PDF"))
        {
            var error = "File type : " + FileExt + "\n\n";
            error += "Please make sure your file is in pdf  format .\n\n";
            alert(error);
            fieldObj.value = '';
            return false;
        }  

    return true;
}

但是这里

multiple pdf files->success

single other files(.txt,.doc etc)->success

pdf+(txt or doc)-> fail

我的需求是多选时只能接受pdf文件。并且它还在 Interner Explorer 上显示 files.length 中的错误怎么做

Answer 1

尝试使用 accept 过滤器。

这是一个演示：

<input name="file1" type="file" accept="application/pdf" multiple />

PS: 在 Firefox 中不起作用。

另一种有前途的解决方案：

document.getElementById("uploadFiles").onchange = function(){  // on selecting file(s)
    for(var file in this.files){ // loop over all files
        if(isNaN(file) === false){  // if it is actually a file and not any other property
            if(this.files[file].type !== "application/pdf"){ // if NOT PDF!!
                alert('Please select PDF files only.');
                return false;
            }
        }
    }
    
    alert('Yay!! All selected files are in PDF format.');
    return true;
}

<input type="file" id="uploadFiles" multiple accept="application/pdf" />

PS：这也适用于 Firefox！

Answer 2

试试这个：

function checkFileUploadExt(fieldObj) {
  var control = document.getElementById("uploadFiles");
  var filelength = control.files.length;

  for (var i = 0; i < control.files.length; i++) {
    var file = control.files[i];
    var FileName = file.name;
    var FileExt = FileName.substr(FileName.lastIndexOf('.') + 1);
    if ((FileExt.toUpperCase() != "PDF")) {
      var error = "File type : " + FileExt + "\n\n";
      error += "Please make sure your file is in pdf  format .\n\n";
      console.error(error);
    }
  }
}

<input type="file" id="uploadFiles" multiple onchange="checkFileUploadExt(this);" />

使用 javascript 进行多文件验证

multiple file validation using javascript

javascript