프로그래밍/HTML+CSS+JavaScript

파일 미리보기

긴자손-1 2014. 8. 20. 20:31
반응형

function readURL(input) {

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

    if(!fileTypeCheck(input)) return false;

       var reader = new FileReader();

       reader.onload = function (e) {        

        $(input).parent().find('img').show().attr('src', e.target.result);

       };

       reader.readAsDataURL(input.files[0]);

   }

}


function fileTypeCheck(input){

var result = false;

var existExt = ".jpg,.gif,.png,.bmp";

var exisExtArray = existExt.split(",");

var Temp_file_name = input.value;

var Temp_strExt_num = "";

if(Temp_file_name != ""){

Temp_strExt_num = Temp_file_name.slice(Temp_file_name.lastIndexOf(".")).toLowerCase();

};

for (var i = 0; i < exisExtArray.length; i++) {

if(Temp_strExt_num == exisExtArray[i]){

result = true; 

}

}

if(result != true){

alert("등록할 수 없는 확장자입니다.");

return false;

}else{

return true;

}

}


<input type="file" name="" id="" onchange="readURL(this);">

<div class="box_preview">

<img src="" alt="" id="previews" width="100px" height="200px">

</div>



반응형