Question

在服务器上传之前，有以下代码进行预览：

$(function(){
    var preview = $(".preview");

  $("#menu_image").change(function(event){
    var input = $(event.currentTarget);
    var file = input[0].files[0];
    var reader = new FileReader();
    reader.onload = function(e){
      var img = new Image;
      img.onload = function() {
        if ((img.with != 160) || (img.height != 160)) {
          return;
        }
        preview.attr("src", img.src);        
      };
      img.src = e.target.result;
    };

    reader.readAsDataURL(file);
  });
});

但是这段代码不会检查文件的类型。我该怎么做？提前致谢。

Answer 1

您不需要加载FileReader来了解文件类型。使用您的代码：

var file = input[0].files[0];

就像检查file.type属性一样简单。

您可以检查文件是否为图像：

if (file.type.match('image.*')) {
    console.log("is an image");
}

哪种类型的图片是：

if (file.type.match('image.*')) {
    console.log("is an image");
    console.log("Show type of image: ", file.type.split("/")[1]);
}

请注意，file.type.split("/")[1]应该是＆＃34;图像＆＃34;

Answer 2

你可以做类似的事情来检查文件扩展名：

var extension = file.name.substring(file.name.lastIndexOf('.'));

    // Only process image files.
    var validFileType = ".jpg , .png , .bmp";
    if (validFileType.toLowerCase().indexOf(extension) < 0) {
        alert("please select valid file type. The supported file types are .jpg , .png , .bmp");
        return false;
    }

Answer 3

尝试使用扩展选择器，如下所示：

if($('img[src $= "jpg"])) dosomething; // if extension is jpg then dosomething

如何通过FileReader检查上传图像的类型？

3 个答案: