파일 + 버튼
본문
이거 예전처럼 +버튼으로 할 수 없나요?
답변 3
크게 두기지 정도 방법이 이습니다
1 버튼에 이벤트걸어서 파일인풋이 열리는 방식
2 파일 api 방식
질문에 가까우면서 손이 덜가는 것은
첫번쩌 일거 같구
첫번째도 선택지가 두개가 있습니다
1 순수한 버튼이나 이미지를 클릭 핬을때 클릭 이벤트에 의해 파일인풋 이벤트가 같이 작동되도록 한다
파일 인풋창은 폼값의 hidden 방식처럼 처리해서 회면상 안보이게 한다
2 파일 인풋창을 css를 이용해서 버튼 이미지 바로 위에 위치 시키고 position:absolute 이용
버튼 이미지만 보이게 하기 위해 파일 인풋창에 css의 opacity :0 처럼
투명도를 내려서 버튼 이미지만 보이게한다
이 방식은 예전부터 여타 웹 브라우저의 낮은 버전에서도 널리 시용되었던 형식이며 손이 제일 덜가는 방법이니 이 방식을 사용해보세요
write.skin.php에서 아래 내용을 수정해서 임의적으로 + 버튼으로 바꿀수는 있습니다.
<li class="bo_w_flie">
<div class="file_wr filebox">
<input type="text" class="fileName" readonly="readonly" placeholder="파일을 첨부하세요">
<label for="bf_file[1]"><i class="fa fa-download lb_icon" aria-hidden="true"></i><span class="sound_only">파일 #1</span><span class="btn_file">파일첨부</span></label>
<input type="file" name="bf_file[1]" id="bf_file[1]" title="파일첨부 1 : 용량 <?php echo $upload_max_filesize; ?> 이하만 업로드 가능" class="frm_file uploadBtn">
<?php if($w == 'u' && $write['qa_file1']) { ?>
<input type="checkbox" id="bf_file_del1" name="bf_file_del[1]" value="1">
<label for="bf_file_del1"><?php echo $write['qa_source1']; ?> 파일 삭제</label>
<?php } ?>
</div>
<br>
<div class="file_wr filebox">
<input type="text" class="fileName" readonly="readonly" placeholder="파일을 첨부하세요">
<label for="bf_file[2]"><i class="fa fa-download lb_icon" aria-hidden="true"></i><span class="sound_only">파일 #2</span><span class="btn_file">파일첨부</span></label>
<input type="file" name="bf_file[2]" id="bf_file[2]" title="파일첨부 2 : 용량 <?php echo $upload_max_filesize; ?> 이하만 업로드 가능" class="frm_file uploadBtn">
<?php if($w == 'u' && $write['qa_file2']) { ?>
<input type="checkbox" id="bf_file_del2" name="bf_file_del[2]" value="1">
<label for="bf_file_del2"><?php echo $write['qa_source2']; ?> 파일 삭제</label>
<?php } ?>
</div>
</li>
아미나나 나리야 참고하세요...