现在，您可以使用新的html5输入验证属性pattern=".+\.(xlsx|xls|csv)"。

好吧，这很尴尬。。。我找到了我想要的解决方案，而且再简单不过了。我使用以下代码来获得所需的结果。希望这对以后的人有所帮助。感谢大家的帮助。

<input id="fileSelect" type="file" accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" />  

有效接受类型：

对于CSV文件（.csv），请使用：

<input type="file" accept=".csv" />

对于Excel文件97-2003（.xls），请使用：

<input type="file" accept="application/vnd.ms-excel" />

对于Excel Files 2007+（.xlsx），请使用：

<input type="file" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" />

对于文本文件（.txt），请使用：

<input type="file" accept="text/plain" />

对于图像文件（.png / .jpg / etc），请使用：

<input type="file" accept="image/*" />

对于HTML文件（.htm，.html），请使用：

<input type="file" accept="text/html" />

对于视频文件（.avi，.mpg，.mpeg，.mp4），请使用：

<input type="file" accept="video/*" />

对于音频文件（.mp3，.wav等），请使用：

<input type="file" accept="audio/*" />

对于PDF文件，请使用：

<input type="file" accept=".pdf" /> 

演示：http :
//jsfiddle.net/dirtyd77/LzLcZ/144/

注意：

如果您试图显示Excel CSV文件（.csv），请不要使用：

• text/csv
• application/csv
• text/comma-separated-values（仅适用于Opera）。

If you are trying to display a particular file type (for example, a WAV or PDF), then this will almost always work...

 <input type="file" accept=".FILETYPE" />

我已经text/comma-separated-values在接受属性中使用了CSV mime-type，并且在Opera中工作正常。尝试text/csv没有运气。

如果建议的其他MIME类型为CSV，则为CSV：

• 文字/逗号分隔值
• 文字/ csv
• 应用程序/ csv
• 应用程序/ excel
• 应用程序/vnd.ms-excel
• 应用程序/ vnd.msexcel
• 文字/任何文字

来源：http：//filext.com/file-extension/CSV

在Safari 10下，这对我不起作用：

<input type="file" accept=".csv" />

我不得不这样写：

<input type="file" accept="text/csv" />

这些天你可以只使用文件扩展名

<input type="file" ID="fileSelect" accept=".xlsx, .xls, .csv"/>