具有有限文件类型的HTML文件输入字段？(HTML file input field with limited file types?)

具有有限文件类型的HTML文件输入字段？(HTML file input field with limited file types?)

如果我有一个HTML文件输入字段，有什么办法可以限制它只允许图像上传？ 我确信这可以用Flash或Java实现，但我暂时试图远离它们。

我在网上找到了“接受”属性，但它似乎没有为我做任何事情（或者我使用它错了。）。 任何帮助或示例表示赞赏。

If I have an HTML file input field, is there any way that I can limit it to only allow image uploads? I'm sure this would be possible with Flash or Java, but I'm trying to stay away from them for the time being.

I found the "accept" attribute online, but it doesn't seem to be doing anything for me (or I'm using it wrong.). Any help or examples is appreciated.

最满意答案

最好的方法是在后端处理它。 根据您要允许的类型类型和后端技术，您可以找到各种方法。

您也可以在javascript中执行此操作，但是您将受到更多限制，并且可能会导致问题crossbrowser：

if((document.form1.upload.value.lastIndexOf(".jpg")==-1) { alert("Please upload only .jpg extention file"); return false; }

（ 通过 ）

如果你使用jquery，请查看这个问题： 如何让jQuery在上传时限制文件类型？

您还可以使用JQuery Validation插件。

$("#myform").validate({ rules: { field: { required: true, accept: "xls|csv" } } });

（ 通过 ）

The best way is to handle that in the backend. Depending on the type of types you want to allow and the backend technology you will find various ways of doing this.

You can also do this in javascript but you'll be more limited and it might lead to issues crossbrowser:

if((document.form1.upload.value.lastIndexOf(".jpg")==-1) { alert("Please upload only .jpg extention file"); return false; }

(via)

If you use jquery, checkout this question: How to have jQuery restrict file types on upload?

You can also use the JQuery Validation plugin.

$("#myform").validate({ rules: { field: { required: true, accept: "xls|csv" } } });

(via)