jQuery 驗證檔案大小和格式

首先引入jquery

<script src=”//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js” ></script>

html部分:

<form id=”myForm” action=”upload.php” method=”POST” enctype=”multipart/form-data” ><input type=”file” size=”60″ name=”myfile” >
<button type=”submit”>新增</button>
</form>

jQuery 代碼:

<script>
$(‘:file’).change(function(){  //選取類型為file且值發生改變的
var file = this.files[0]; //定義file=發生改的file
name = file.name; //name=檔案名稱
size = file.size; //size=檔案大小
type = file.type; //type=檔案型態

if(file.size > 300000) { //假如檔案大小超過300KB (300000/1024)

alert(“圖片上限300KB!!”); //顯示警告!!
$(this).val(”);  //將檔案欄設為空白
}
else if(file.type != ‘image/png’ && file.type != ‘image/jpg’

&& !file.type != ‘image/gif’ && file.type != ‘image/jpeg’ ) { //假如檔案格式不等於 png 、jpg、gif、jpeg
alert(“檔案格式不符合: png, jpg or gif”); //顯示警告
$(this).val(”); //將檔案欄設為空
}
});
</script>

感謝您的閱讀,請用力地分享讓大家知道吧~~

Aidec Li
學我所見,寫我所學。凡事略懂略懂~~
更多 Aidec Li 的文章...

很抱歉,此文章關閉留言