jquery 파일첨부관련 질문있습니다! 채택완료
외로운퍼블리셔
2년 전
조회 3,911
파일찾기 버튼을 눌러서 파일들을 1개 또는 여러개 첨부하면 placeholder를 첨부한 파일명으로 교체시키고싶어요
</p>
<p>$("#file").on('change',function(){</p>
<p> let files=$('input[name="file_name"]')[0].files;</p>
<p> let fl;</p>
<p> for(let i=0; i<files.length; i++){</p>
<p> let fl = files[i].name;</p>
<p> console.log("파일명은 : " + fl);</p>
<p> }</p>
<p> console.log("files의 변수타입 : " + typeof(files));</p>
<p> console.log(files);</p>
<p> })</p>
<p>
위 script로 확인해보면 제가 생각했을때는
1. 파일첨부가 확인되면 첨부된 파일들의 name을 변수에 저장한다
- 파일들의 타입은 object로 저장된다
- object안에 있는 name의 값을 string형 문자열로 나열하여 다른 변수에 저장한다
2. 변수에 저장된 파일 name들로 placeholder를 바꾼다.
이렇게 할 수 있지 않을까? 생각은 하는데
아직 초보라 잘 모르겠습니다 알려주세요....
댓글을 작성하려면 로그인이 필요합니다.
답변 1개
채택된 답변
+20 포인트
2년 전
</p>
<p><style>
.upload-name { width: 40em; font-size: 0.9em; padding: 0.4em; }
.file-search { background-color: #36a0e2; color: #fff; font-size: 0.9em; padding: 0.4em; }
#file { visibility: hidden; }
</style></p>
<p><script src="<a href="http://code.jquery.com/jquery-latest.min.js"></script>" target="_blank" rel="noopener noreferrer">http://code.jquery.com/jquery-latest.min.js"></script></a></p>
<p><div class="fileBox">
<input class="upload-name" value="첨부파일" placeholder="첨부파일" readonly>
<label for="file" class="file-search">파일찾기</label>
<input type="file" name="file_name" id="file" multiple>
</div></p>
<p><script>
$("#file").on('change',function(){
let fval_default = '첨부파일';
$('.upload-name').val(fval_default);
let fval = fval_default;</p>
<p> let files=$('input[name="file_name"]')[0].files;
let fl;
for(let i=0; i<files.length; i++){
let fl = files[i].name;
console.log("파일명은 : " + fl);
if (fval == fval_default) {
fval = fl;
} else {
fval += ',' + fl;
}
$('.upload-name').val(fval);
}
console.log("files의 변수타입 : " + typeof(files));
console.log(files);
});
</script></p>
<p>
로그인 후 평가할 수 있습니다
답변에 대한 댓글 1개
�
외로운퍼블리셔
2년 전
이것때문에 하루종일 고생했는데 알려주셔서 정말 감사합니다!!
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인