检查上传 img 扩展 jQuery

当用户上传图片时，我们需要确保上传的文件是实际的图像文件。为此，我们可以使用 jQuery 来检查上传的文件的文件类型和扩展名。

文件类型检查

要检查文件的类型，可以使用 HTML5 的 File API。在 jQuery 中，我们可以使用 $.ajax() 来上传文件并获取其类型。下面是一个示例：

$('input[type="file"]').on('change', function(){
  var file = this.files[0];
  var fileType = file.type;
  if (!fileType.match(/^image\//)) {
    alert('请选择图片文件');
  }
  // ...
});

在此示例中，我们使用 this.files 获取上传文件的引用，然后使用 file.type 属性获取文件的 MIME 类型。最后，我们使用正则表达式检查文件类型是否为图像。

文件扩展名检查

要检查文件的扩展名，可以使用 JavaScript 的 String.endsWith() 方法。下面是一个示例：

$('input[type="file"]').on('change', function(){
  var file = this.files[0];
  var fileName = file.name;
  if (!fileName.endsWith('.jpg') && !fileName.endsWith('.jpeg') && !fileName.endsWith('.png') && !fileName.endsWith('.gif')) {
    alert('请选择合适的图片格式');
  }
  // ...
});

在此示例中，我们使用 file.name 属性获取上传文件的文件名，并使用 String.endsWith() 方法检查文件扩展名是否为图像格式的扩展名。

总结

使用 jQuery 来检查上传图像的文件类型和扩展名，可以确保上传的文件是实际的图像文件，从而减少不必要的错误和安全问题。此外，HTML5 的 File API 来处理文件上传可以使我们更方便地获取上传的文件信息。