파일 업로드시 미리보기 질문 채택완료
아로마라이프
4년 전
조회 2,250
</p>
<p> <script type="text/javascript"></p>
<p> </p>
<p> var sel_file;</p>
<p> </p>
<p> $(document).ready(function() {</p>
<p> $("#input_img").on("change", handleImgFileSelect);</p>
<p> }); </p>
<p> </p>
<p> function handleImgFileSelect(e) {</p>
<p> var files = e.target.files;</p>
<p> var filesArr = Array.prototype.slice.call(files);</p>
<p> </p>
<p> filesArr.forEach(function(f) {</p>
<p> if(!f.type.match("image.*")) {</p>
<p> alert("확장자는 이미지 확장자만 가능합니다.");</p>
<p> return;</p>
<p> }</p>
<p> </p>
<p> sel_file = f;</p>
<p> </p>
<p> var reader = new FileReader();</p>
<p> reader.onload = function(e) {</p>
<p> $("#img").attr("src", e.target.result);</p>
<p> }</p>
<p> reader.readAsDataURL(f);</p>
<p> });</p>
<p> }</p>
<p> </p>
<p> </script></p>
<p></head></p>
<p> </p>
<p><body></p>
<p> </p>
<p> </p>
<p> <div></p>
<p> <h2><b>이미지 미리보기</b></h2></p>
<p> <p class="title">이미지 업로드</p></p>
<p> <input type="file" id="input_img" /></p>
<p> </div></p>
<p> </p>
<p> <div></p>
<p> <div class="img_wrap"></p>
<p> <img id="img" /></p>
<p> </div></p>
<p> </div></p>
<p>
위 코드를 구글링해서 검색했는데
다중업로드가 아닌 파일 2개를 업로드하는 방식입니다. input 2개로 각각 올림
위 소스를 사용시 등록은 잘 되는데 미리보기 파일이 2개씩 생깁니다.
한개만 생성할려고 할때는 어떻게 해야 하는지 잘 모르겠습니다. ㅠㅠ
댓글을 작성하려면 로그인이 필요합니다.
답변 1개
답변을 작성하려면 로그인이 필요합니다.
로그인