* 원하는 기능
- 자바스크립트로 파일을 업로드 하기전에 용량 체크한다.
- 2MB 이하의 파일만 허용한다.
- 용량 제한에 걸리면 선택한 파일은 무시한다.
아래에서 파일을 직접 선택해 보세요.
2MB 이상인 파일일 경우 경고창이 뜹니다.
등록일 : ,
업로드 파일 용량 체크하기
HTML
<input type="file" name="file1" onchange="checkFile(this)"><br>
<input type="file" name="file2" onchange="checkFile(this)"><br>
<input type="file" name="file3" onchange="checkFile(this)"><br>
자바스크립트
function checkFile(el){
// files 로 해당 파일 정보 얻기.
var file = el.files;
// file[0].size 는 파일 용량 정보입니다.
if(file[0].size > 1024 * 1024 * 2){
// 용량 초과시 경고후 해당 파일의 용량도 보여줌
alert('2MB 이하 파일만 등록할 수 있습니다.\n\n' + '현재파일 용량 : ' + (Math.round(file[0].size / 1024 / 1024 * 100) / 100) + 'MB');
}
// 체크를 통과했다면 종료.
else return;
// 체크에 걸리면 선택된 내용 취소 처리를 해야함.
// 파일선택 폼의 내용은 스크립트로 컨트롤 할 수 없습니다.
// 그래서 그냥 새로 폼을 새로 써주는 방식으로 초기화 합니다.
// 이렇게 하면 간단 !?
el.outerHTML = el.outerHTML;
}
방문해 주셔서 감사드립니다 !!