본문 바로가기
JAVASCRIPT

[JAVASCRIPT] 첨부파일 이미지 미리보기 (input type="file")

by madinthe90 2022. 2. 22.
반응형

간단하게 첨부파일 이미지를 미기보기 할 수 있다!

 

- HTML

<input type="file" onchange="readURL(this);"> 
<img id="preview" />

 

- SCRIPT

function readURL(input) {
  if (input.files && input.files[0]) {
    var reader = new FileReader();
    reader.onload = function(e) {
      document.getElementById('preview').src = e.target.result;
    };
    reader.readAsDataURL(input.files[0]);
  } else {
    document.getElementById('preview').src = "";
  }
}

 

- 결과

반응형

댓글