前端與後臺數據進行對接時，就避免不了要使用ajax進行http請求，常用的請求就兩個post與get；然而常見的post請求的需求是文件上傳，可能我一說到文件上傳大家都覺得so easy啊，沒什麽嘛，就是幾行 js 代碼就能搞定的事。是的，簡單的文件上傳是可以直接使用FormData()對象將文件上傳；如果問題只是這麽簡單就好了，可能大家也都遇到過上傳文件類型的限制，不知道大家有沒有註意到這麽簡單的方法將文件類型過濾，下面直接貼代碼：

　1、　js實現：js實現上傳文件類型的限制是將允許上傳的文件的後綴名全部列出，以數組的形式存儲，然後通過數組的indexof方法即可，以圖片為例代碼如下

　　　　var fileType = [‘jpg‘ ,‘png‘ , ‘jpeg‘ , ‘gif‘ , ‘bmp‘]

　　　　var file = e.target.files[0]

　　　　if(fileType.indexof(file) < 0) {

　　　　　　alert(‘不支持這種類型的文件’)

　　　　}

關於數組的indexof()方法怎麽用，可以看我的這篇博文：http://www.cnblogs.com/novice007/p/7077914.html

　2、　css實現：不知道大家有沒有註意到一個細節，那就是我選擇了文件之後，如果不是我規定的類型頁面就會彈框告訴我不支持這個格式的文件，那麽問題就來了，既然不支持這種格式的文件，那我可不可以在點開文件進行選擇的時候，不是我要的格式的文件就不顯示，那我就不能選擇，同時頁面也不會這麽討厭的讓我去重新選擇它要的格式，能做到嗎？答案是能，而且不需要任何代碼，簡簡單單的在html頁面就能實現：代碼如下：

　　<input type ="file" accept="image/jpg, image/png, image/jpeg, image/gif">

　　在input文件框中，添加accept特性，特性中限制文件類型，那麽在點開輸入框進入本地磁盤選擇文件時，不是accept特性指定的文件類型那麽你在打開的本地磁盤文件中就看不到這些文件。

這是最近做項目時遇到的一個很好解決文件類型限制問題的方法，所以寫出這篇博文跟大家分享，如有不足之處，歡迎與我交流：qq: 1540302851

input type='file'限制上傳文件類型