问题
I am working with file upload to the server using HTML tag:
<input type="file">
When I click on the browse button it shows me a file open dialog. Can I filter the files by passing the extension filter to that dialog? Like we can do in .Net framework's file open dialog by passing some thing like:
Text files *.txt|.txt
Using this filter we can only open .txt files. Other files not shown to the user. Is there any option for this dialog?
回答1:
Standard
Actually in HTML5 you can set the accept attribute so now this is possible! The W3C standard states:
The accept attribute may be specified to provide user agents with a hint of what file types will be accepted.
Accepted values [Full list in Wikipedia]
Just pass a valid MIME type to the attribute for example:
audio/*video/*video/ogg
image/*image/jpgimage/bmp
Example code
<input type="file" accept="image/*">
回答2:
my question is, can i filter the files by passing the extension filter to that dialog?
No you can't do this with the plain type="file" input. You could use some Flash upload controls though that allow you to achieve this.
回答3:
I don't think you can edit this dialog options, but you can validate the file after the user select it.
tO edit the dialog, I remember that you can do that by a flash or Silverlight uploaders, such as swfUpload.
回答4:
Here is a piece of code that I came up with when I was in need of filtering some of the file types:
<input type="file" accept=".xls, .xlsx, .csv" placeholder="File to be upload" />
Accept attribute supports multiple files comma separated.
来源：https://stackoverflow.com/questions/6641283/filter-files-in-html-file-open-dialog