验证文件上传 - Jquery 和“接受”属性答案

【问题标题】：Validating File Upload - Jquery and "Accept" attribute验证文件上传 - Jquery 和“接受”属性
【发布时间】：2012-05-08 10:36:41
【问题描述】：

我正在使用表单上传文件。我只想上传 PDF 文件。这是我的代码：

允许用户选择文件的输入框：

@Html.FileBox(m => m.FileName, new { id = "FileName", accept = "application/pdf" })

以及显示错误信息的地方：

@Html.ValidationMessageFor(m=>m.FileName)

为输入字段生成的代码是：

    <input id="FileName" type="file" name="FileName" data-val-required="The File Name field is required." data-val-length-max="512" data-val-length="The field File Name must be a string with a maximum length of 512." data-val="true" accept="application/pdf">

现在即使我选择 PDF 文件，我也会收到错误 Please enter a value with a valid extension.

我正在使用 MVC 3 和不显眼的 jquery 来验证表单。

【问题讨论】：

你想出这个了吗？我也有同样的问题。就我而言，我需要接受多种类型（“image/gif,image/png,image/jpeg”）。
不，我没有。我不得不删除“接受”属性。可能是 Jquery Validation 不支持为“accept”验证 MIME 类型。
@ThiagoSilva 对于图像类型，这应该不是问题。你试过accept="image/gif,image/jpeg"之类的吗？
是的。我有“图像/gif，图像/jpeg，图像/png”。我什至去掉了除了一种 mime 类型之外的所有类型，验证会阻止我上传任何东西。当我删除“接受”属性时，它工作正常。我想我只会诉诸于仅在服务器端进行验证。

标签： jquery asp.net-mvc-3 jquery-validate asp.net-mvc-validation

【解决方案1】：

我遇到了同样的问题，不得不完全禁用对接受属性的验证。我在我的页面中添加了以下行并且它起作用了：

$.validator.addMethod('accept', function () { return true; });

【讨论】：

谢谢！这就是我所需要的。我只对过滤 pdf 文件的 file=open 对话框感兴趣。我打算在服务器端验证文件。
成功了！谢谢！ -Edit- 仅供参考，如果需要，请使用提供的匿名函数来验证项目。
“accept”方法的行为在 1.10.0 版本中发生了变化，因此不再需要禁用它。有关详细信息，请查看我的答案。

【解决方案2】：

jQuery Validation 中内置的“accept”规则方法接受类似于“jpg|png”格式的值。

“accept”HTML 属性采用类似于“image/jpeg,image/png”的格式。

在这方面，jQuery Validation 和 HTML 标准似乎是不兼容的。

在这里，您可以阅读有关jQuery Validation's "accept" rule 和HTML5 "accept" attribute 的更多信息。

【讨论】：

“accept”方法的行为在 1.10.0 版本中发生了变化。有关详细信息，请查看我的答案。

【解决方案3】：

他们在 1.10.0 版本中更改了“接受”方法的行为。它现在查看的是 mime 类型，而不是检查文件扩展名。旧行为现在可用作“扩展”方法。所以你只需要更新你的 jquery 验证插件版本就可以了。我用 1.11.0 替换了我当前的版本 1.9.0，并将有效的 mime 类型设置为接受属性。它现在按预期工作：

accept="image/*, application/pdf"

【讨论】：

【解决方案4】：

如果你把这两种格式都作为你的接受属性，它应该可以工作

accept="image/jpeg,image/png,jpg|png"

【讨论】：