반응형
250x250
«   2025/01   »
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
Notice
Recent Posts
Today
Total
관리 메뉴

네이처리 노트

[jQuery] input file 이미지 미리보기 | 파일지우기 초기화하기 본문

개발기록/Javascript

[jQuery] input file 이미지 미리보기 | 파일지우기 초기화하기

네이처리 2022. 9. 13. 13:40
728x90
반응형

공부하면서 정리한 내용입니다
참고한 내용은 링크를 확인해주세요



let file= $("input[type=file]");
let img = $("img");

file.off("change").on("change", function() 
{
    if(file.get(0).files && file.get(0).files[0])
    {
        let fReader = new FileReader();
        fReader.readAsDataURL(file.get(0).files[0]);
        fReader.onload = function(event){

            img.attr("src", event.target.result);
            file.val(""); // 파일 초기화
        };
    }
});

// 파일정보확인 
file[0].files[0]     
file.get(0).files[0]
file.get(0).files          //파일 전체정보
file.get(0).files.length   //파일 개수






728x90
반응형
Comments