※ 제이쿼리 스크립트 파일 필요!
[Javascript 소스]
<script type="text/javascript">
// 첨부파일 확장자 확인
function checkImg(obj, ext){
var check = false;
var extName = $(obj).val().substring($(obj).val().lastIndexOf(".")+1).toUpperCase();
var str = ext.split(",");
for (var i=0;i<str.length;i++) {
if ( extName == $.trim(str[i]) ) {
check = true; break;
} else
check = false;
}
if(!check){
alert(ext+" 이미지 파일만 업로드 가능합니다.");
}
return check;
}
// 첨부파일 용량 확인
function checkImgSize(obj, size) {
var check = false;
if(window.ActiveXObject) {//IE용인데 IE8이하는 안됨...
var fso = new ActiveXObject("Scripting.FileSystemObject");
//var filepath = document.getElementById(obj).value;
var filepath = obj[0].value;
var thefile = fso.getFile(filepath);
sizeinbytes = thefile.size;
} else {//IE 외
//sizeinbytes = document.getElementById(obj).files[0].size;
sizeinbytes = obj[0].files[0].size;
}
var fSExt = new Array('Bytes', 'KB', 'MB', 'GB');
var i = 0;
var checkSize = size;
while(checkSize>900) {
checkSize/=1024;
i++;
}
checkSize = (Math.round(checkSize*100)/100)+' '+fSExt[i];
var fSize = sizeinbytes;
if(fSize > size) {
alert("첨부파일은 "+ checkSize + " 이하로 등록가능합니다.");
check = false;
} else {
check = true;
}
return check;
}
</script>[html 소스]
<!DOCTYPE html>
<html>
<head>
<title>File upload check</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.3.min.js"></script>
<script type="text/javascript">
// 첨부파일 확장자 확인
function checkImg(obj, ext){
var check = false;
var extName = $(obj).val().substring($(obj).val().lastIndexOf(".")+1).toUpperCase();
var str = ext.split(",");
for (var i=0;i<str.length;i++) {
if(extName == $.trim(str[i])) {
check = true; break;
} else
check = false;
}
if(!check) {
alert(ext+" 파일만 업로드 가능합니다.");
}
return check;
}
// 첨부파일 용량 확인
function checkImgSize(obj, size) {
var check = false;
if(window.ActiveXObject) {//IE용인데 IE8이하는 안됨...
var fso = new ActiveXObject("Scripting.FileSystemObject");
//var filepath = document.getElementById(obj).value;
var filepath = obj[0].value;
var thefile = fso.getFile(filepath);
sizeinbytes = thefile.size;
} else {//IE 외
//sizeinbytes = document.getElementById(obj).files[0].size;
sizeinbytes = obj[0].files[0].size;
}
var fSExt = new Array('Bytes', 'KB', 'MB', 'GB');
var i = 0;
var checkSize = size;
while(checkSize>900) {
checkSize/=1024;
i++;
}
checkSize = (Math.round(checkSize*100)/100)+' '+fSExt[i];
var fSize = sizeinbytes;
if(fSize > size) {
alert("첨부파일은 "+ checkSize + " 이하로 등록가능합니다.");
check = false;
} else {
check = true;
}
return check;
}
// 이미지 선택
document.getElementById("fileName").onchange = function () {
if(this.value != "") {
var extPlan = "JPG, PNG";
var checkSize = 1024*1024*5; // 5MB
if(!checkImg($('#fileName'), extPlan) | !checkImgSize($('#fileName'), checkSize)) {
this.value = "";
return;
}
}
};
</script>
</head>
<body>
<input id="fileName" type="file" name="fileName" accept="image/*">
</body>
</html>
'Web 프로그래밍 > Javascript & jQuery' 카테고리의 다른 글
| [Javascript & jQuery] 공백 여부 & 특수 문자 여부 & 비밀번호 패턴 체크 (2) | 2017.06.08 |
|---|---|
| [Javascript & jQuery] 숫자데이터를 금액형식으로 표시 (콤마추가) + Null 체크 + 원하는 만큼 '0' 생성 (0) | 2017.06.08 |
| [Javascript & jQuery] 정규식을 이용한 데이터 체크 (1) | 2017.05.25 |
| [Javascript & jQuery] 현재 페이지의 주소 얻기 & 모바일 웹에서 많이 사용되는 스크롤이 최하단에 위치시 발생하는 함수 (0) | 2017.01.02 |
| [Javascript & jQuery] 디바이스 정보 조회하기 (0) | 2016.12.06 |
