[jQuery] new fileReader 파일첨부 소스

설명

파일첨부 커스터마이징 시 필요한 소스
(+ 이미지 미리보기)

function fileAttach(e) {
    var file = e.target;
    var fileList = file.files;

    // 읽기
    var reader = new FileReader();
    reader.readAsDataURL(fileList[0]);

    //로드 한 후
    reader.onload = function() {
      //input text에 업로드한 파일명 꽂아주기
      $(file)
        .next()
        .find("input")
        .val(fileList[0].name);

      //썸네일 꽂아주기
      if (
        $(file)
          .parent()
          .find(".file-image-area").length > 0
      ) {
        $(file)
          .parent()
          .find(".file-image-area")
          .html("<div><img src=" + reader.result + " alt='' /></div>");
      }
    };
  }
  $(document).on("change", ".inp-wrap.file > input[type='file']", fileAttach);