将文件类型限制为多个文件上传器

Question

我希望获得一些帮助，仅允许上传 JPG、PNG、PDF 和 DOCX 文件，解决方案在此 JSFIDDLE Demo

执行文件上传的javascript如下：

function makeFileList() {
    var input = 
document.getElementById("filesToUpload");
    var ul = 
document.getElementById("fileList");
    while (ul.hasChildNodes()) {
      ul.removeChild(ul.firstChild);
    }
    for (var i = 0; i < input.files.length; i++) {
      var li = document.createElement("li");
      li.innerHTML = input.files[i].name;
      ul.appendChild(li);
    }
    if (!ul.hasChildNodes()) {
      var li = document.createElement("li");
      li.innerHTML = 'No Files Selected';
      ul.appendChild(li);
    }
  }

如果用户尝试上传未列入白名单的文件类型，我不需要显示警告。所以结果就是只在屏幕上显示允许的文件。

感谢您的帮助！

Answer 1

在输入中添加accept=".jpg,.png,.pdf,.docx"。

<input type="file" name="filesToUpload" id="filesToUpload" multiple="" accept=".jpg,.png,.pdf,.docx" onchange="makeFileList();">
</div>