본문 바로가기

Web Dev/Javascript

Javascript 첨부파일 용량 제한하는 방법 쉽습니다 feat JQuery

반응형

 

HTML

<p class="guide">-파일 첨부시 250KB 이하  용량만 첨부 가능</p>
<input class="upload_file" name ="wr_20" id="wr_20" type="file">

위와 같은 파일 업로드 input 태그를 만들고 

파일을 업로드 할 때 

용량 제한은 서버 관리를 위해 매우 중요하다. 

너무 큰 용량의 파일의 경우 해당 파일을 서버까지 전송하는데 많은 시간과 에러를 발생시킨다. 

JAVASCRIPT

 $(document).ready(function() {
 
 $('.upload_file').change(function() {
		    var file = this.files[0];
		    var maxSize = 250 * 1024; // 250KB 제한 (1KB = 1024 bytes)

		    if (file.size > maxSize) {
		      alert("파일 크기는 250KB 이하여야 합니다.");
		      $(this).val(''); // 선택한 파일 초기화
		      return;
		    }
            
       }

위의 코드에서 maxSize 변수를 통해 파일 크기 제한을 설정할 수 있습니다. 현재는 250KB로 설정되어 있으며, 필요에 따라 원하는 크기로 변경할 수 있습니다. 파일 크기는 file.size를 통해 확인하며, 이를 통해 업로드 전에 파일 크기를 체크하고 첨부 파일의 용량을 제한 할 수 있다. 

반응형