[JavaScript] Spring쇼핑몰 프로젝트 - input태그 파일 이미지 미리 보기

[JavaScript] Spring쇼핑몰 프로젝트 - input태그 파일 이미지 미리 보기

function readImage(input) {

// input 태그에 이미지를 업로드 한 경우

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

// FileReader 생성

const reader = new FileReader();

reader. onload = function (e){

const previewImage = document . getElementById ( "img태그 id값" );

previewImage.src = e.target.result;

}

// reader가 업로드된 이미지의 경로를 읽는다.

reader.readAsDataURL(input.files[ 0 ])

}

}

// input 태그에 change 이벤트 설정

const inputImage = document . getElementById ( "input태그 id값" );

inputImage. addEventListener ( "change" , function (e){

readImage(e.target);

});

from http://issaac.tistory.com/8 by ccl(A) rewrite - 2021-12-13 13:01:04