解決方案:
使用 input 的 accept 屬性指定接受文件類型
-----------更新---------------
之前的代碼有個缺點,打開文件窗口時會自動篩選文件夾下所有符合設定類型的文件,造成文件窗口延遲一定時間。
優化的方法是列出你需要的 詳細 類型,比如:
For Image Files (.png/.jpg/etc), use: <input type="file" accept="image/x-png,image/gif,image/jpeg,image/bmp" />
這樣打開的速度就快很多了
-------------之前的代碼---------------------
下面是指定類型的代碼:
Valid Accept Types:
For CSV files (.csv), use:
<input type="file" accept=".csv" /> For Excel Files 2003-2007 (.xls), use: <input type="file" accept="application/vnd.ms-excel" /> For Excel Files 2010 (.xlsx), use: <input type="file" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" /> For Text Files (.txt) use: <input type="file" accept="text/plain" /> For Image Files (.png/.jpg/etc), use: <input type="file" accept="image/*" /> For HTML Files (.htm,.html), use: <input type="file" accept="text/html" /> For Video Files (.avi, .mpg, .mpeg, .mp4), use: <input type="file" accept="video/*" /> For Audio Files (.mp3, .wav, etc), use: <input type="file" accept="audio/*" /> For PDF Files, use: <input type="file" accept=".pdf" />