JavaScript - 파일 용량 제한

 

파일 용량 제한

자바스크립트단에서 파일 업로드 시 용량을 제한해보자.

html

<input type="file" name="IMG_IMG" title="파일명">

javascript

$("input[name=IMG_IMG]").off().on("change", function(){

	if (this.files && this.files[0]) {

		var maxSize = 5 * 1024 * 1024;
		var fileSize = this.files[0].size;

		if(fileSize > maxSize){
			alert("첨부파일 사이즈는 5MB 이내로 등록 가능합니다.");
			$(this).val('');
			return false;
		}
	}
});

파일 객체는 Array로 저장된다. (this.files[0] = 업로드한 파일)

  • if (this.files && this.files[0]) { : 업로드한 파일이 있는 지 확인
  • var maxSize = 5 * 1024 * 1024; : 5MB 사이즈로 최대용량 지정
  • var fileSize = this.files[0].size; : 업로드한 파일의 용량
  • $(this).val(''); : 업로드한 파일 제거


위 내용을 입력하고 실행해보면 용량제한이 잘되는 것을 볼 수 있다!