jquery在提交之前验证文件类型和文件大小

可能重复：

是否有好的jquery脚本或其他方法可以在将文件上载到服务器之前验证文件大小和文件类型？我试着到处找，但从来没有找到做这种事的方法

从这里开始：

我不确定它是否能在像IE6/7Duh这样的老浏览器上运行，谁还在使用这些浏览器，但你可以试试。不过，它应该适用于所有现代浏览器。试试看：

<form enctype="multipart/form-data">
<input name="file" type="file" />
<input type="submit" value="Upload" />
</form>
$(':file').change(function(){
    var file = this.files[0];
    name = file.name;
    size = file.size;
    type = file.type;
    //your validation
});

---

我建议如下：

$('input:file').change(
    function(e) {
        var files = e.originalEvent.target.files;
        for (var i=0, len=files.length; i<len; i++){
            console.log(files[i].fileName, files[i].type, files[i].fileSize);
        }
    });​

最后一段代码在Chromium 19和Firefox 15中测试并运行，两者都在Ubuntu11.04上。

没有必要重新发明轮子。它有一个acceptFileTypes选项，允许您提供与给定文件类型匹配的正则表达式，以及一个maxFileSize选项，例如：

{
  fileTypes: /^(gif|jpeg|png)$/,
  maxFileSize: 20000000 // 20MB
}

---

但是，请注意，这只适用于支持的web浏览器。否则，您必须在服务器端验证文件类型。

检查：这似乎是一个重复的问题。自从我开始这个项目以来，我从7月份就一直在处理这个问题。问题是，它太复杂了，无法定制。它是完整版还是基本版。@Norman：我同意使用这个插件可能有点困难。我最近在一个项目中使用了它。你想要定制什么？我想要的很简单，但在这里解释起来有点棘手：-也许我会给你发电子邮件：？好的，你能试着解释一下吗-我不断得到：未定义图像/JPEG未定义。我做错什么了吗？@Norman：我已经修改了第二个代码块，它在Firefox15和Chromium 19中似乎工作可靠；我无法测试IE，但我怀疑它会在低于9或10的版本中失败。这次它运行良好。我会做一些测试，看看情况如何。祝你好运；让我/我们知道你的测试进展如何！

{
  fileTypes: /^(gif|jpeg|png)$/,
  maxFileSize: 20000000 // 20MB
}