方法一(不推薦使用):用jS獲獲取擴展名進行驗證:
<script type="text/javascript" charset="utf-8">
function change(e){
var src=e.target || window.event.srcElement; //獲取事件源,兼容chrome/IE
src.style.background='red';
alert( src.value );
//測試chrome瀏覽器、IE6,獲取的文件名帶有文件的path路徑
//下面把路徑截取為文件名
var filename=src.value;
alert( filename.substring( filename.lastIndexOf('\\')+1 ) );
//獲取文件名的后綴名(文件格式)
alert( filename.substring( filename.lastIndexOf('.')+1 ) );
}
</script>
</head>
<body >
選擇文件:
<br>
<input type='file' onchange="change(event);" >
</body>
方法二(好方法):
HTML <input> 標簽的 accept 屬性
實例
在文件上傳中使用 accept 屬性,本例中的輸入字段可以接受 GIF 和 JPEG 兩種圖像:(上傳選擇文件時候,只顯示這兩種文件)
<form>
<input type="file" name="pic" id="pic" accept="image/gif, image/jpeg"
/>
</form>
如果不限制圖像的格式,可以寫為:accept="image/*"。
定義和用法
accept 屬性只能與 <input type="file"> 配合使用。它規定能夠通過文件上傳進行提交的文件類型。
提示:請避免使用該屬性。應該在服務器端驗證文件上傳。