Js 或 jquery file.type.match 仅适用于 jpg 和 png答案

【问题标题】：Js or jquery file.type.match for jpg and png onlyJs 或 jquery file.type.match 仅适用于 jpg 和 png
【发布时间】：2012-12-30 00:35:58
【问题描述】：

如何使用 file.type.match 将 mimetype 限制为仅 png 和 jpg

下面是我的代码

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

if (fileInput.type.match('image/jpeg'))  
      //I not thinking to use if(xx || xx)
      //prefer using var mimeType = jpg,png  many tries but not work
{
alert("Right");
}else{
alert("wrong");
}

【问题讨论】：

标签： javascript jquery mime-types

【解决方案1】：

从您的问题来看，您似乎不想这样做：

if (fileInput.type.match('image/jpeg') || fileInput.type.match('image/png'))  
  //I not thinking to use if(xx || xx)
  //prefer using var mimeType = jpg,png  many tries but not work
{
  alert("Right");
}else{
  alert("wrong");
}

您可以创建一系列可接受的扩展并循环访问它们，例如：

var fileInput = document.getElementById("myfileinput").files[0];
var allowed = ["jpeg", "png"];
var found = false;

allowed.forEach(function(extension) {
  if (fileInput.type.match('image/'+extension)) {
    found = true;
  }
})

if(found) {
  alert("Right");
}
else{
  alert("wrong");
}

请参阅此fiddle 进行测试。

【讨论】：

【解决方案2】：

也可以用|作为OR运算符一行完成：

if (fileInput.type.match('image/jpeg|image/png')) {...}

【讨论】：

【解决方案3】：

使用attr-accept（或复制其代码）使您的 mime 类型验证更具前瞻性，并可在其他情况下重用。

【讨论】：