첨부파일 미리보기를 만들고 있는데 2개중 하나의 이미지가 뜨지를 않습니다.

매출이 오르면 내리는 수수료! 지금 수수료센터에서 전자결제(PG)수수료 비교견적 신청해 보세요!
첨부파일 미리보기를 만들고 있는데 2개중 하나의 이미지가 뜨지를 않습니다.

QA

첨부파일 미리보기를 만들고 있는데 2개중 하나의 이미지가 뜨지를 않습니다.

본문


<input type="file" name="bf_file[0]" id="bf_file_0" multiple>
<div class="image_holder">
<img class="img_thumb" id="image_holder0" style="width: 100%;">
</div>
<input type="file" name="bf_file[1]" id="bf_file_1" multiple>
<div class="image_holder">
<img class="img_thumb" id="image_holder1" style="width: 100%;">
</div>
 
<script>
                var sel_file;
                $(document).ready(function() {
                    $("#bf_file_0").on("change", handleImgFileSelect0);
                    $("#bf_file_1").on("change", handleImgFileSelect0);
                });
 
                function handleImgFileSelect0(e) {
                    var files = e.target.files;
                    var filesArr = Array.prototype.slice.call(files);
 
                    filesArr.forEach(function(f) {
                        if(!f.type.match("image.*")) {
                            alert("이미지 파일만 첨부해주세요.");
                            return;
                        }
 
                        sel_file = f;
                        var reader = new FileReader();
                        reader.onload = function(e) {
                            $("#image_holder0").attr("src", e.target.result);
                            $("#image_holder1").attr("src", e.target.result);
                            console.log($("#image_holder0").attr("src", e.target.result));
                            console.log($("#image_holder1").attr("src", e.target.result));
                        }
                        reader.readAsDataURL(f);
                        $("#bf_file_0").val("");
                        $("#bf_file_1").val("");
                    });
                }
            </script>

 

갤러리 게시판에서 글작성시 첨부파일 이미지의 미리보기 기능을 만들고 있습니다. 검색을 통해서 어찌어찌 만들고 있는데 처음에는 hadleImgFileSelect0, hadleImgFileSelect1로 내용만 조금 바꿔서 각기 실행을 시키려고 했는데 찾아보니 fileReader가 두번 작동을 할 수가 없더라구요

 

그래서 결국 하나만 쓰기로 하고 분기를 주려고 하는데 어떤 식으로 줘야하는지 감이 안잡힙니다

어떻게 하면 미리보기 기능을 정상적으로 실행시킬수 있을까요?ㅠ

이 질문에 댓글 쓰기 :

답변 1

get_file 함수를 쓰셔서 해당 게시글의 첨부파일을 호출해올 수 있습니다.

$file = get_file($bo_table, $list[$i]['wr_id']);

첫번째 첨부파일

<img src="'.$file[0]['path'].'/'.$file[0]['file'].'" width="150" height="150">

두번째 첨부파일

<img src="'.$file[1]['path'].'/'.$file[1]['file'].'" width="150" height="150">

답변을 작성하시기 전에 로그인 해주세요.
전체 16
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT