답변 1개
3년 전
애초에 제가 제이쿼리 자체를 사용하지 않는 사람이라... 순수 바닐라로 예제만 짜 봅니다.
input 는 3개인데 무한 생성이 가능합니다.
여러개 생성시는 루프문으로 돌려서 생성해도 됩니다.
input 의 id 나 name 은 본인이 원하는 걸로 주세요.
</p>
<p><script>
function imgCall(img, call) {
reader = new FileReader;
reader.onload = function () {
img.src = reader.result;
}
reader.readAsDataURL(call.files[0]);
}
</script></p>
<p><input type=file accept=image/* onchange=imgCall(image_1,this)>
<img id=image_1 style=width:120px>
</p>
<p><input type=file accept=image/* onchange=imgCall(image_2,this)>
<img id=image_2 style=width:120px>
</p>
<p><input type=file accept=image/* onchange=imgCall(image_3,this)>
<img id=image_3 style=width:120px></p>
<p>
에를 들어 10개를 루프문으로 돌린다면 아래처럼 되겠죠.
</p>
<p><script>
function imgCall(img, call) {
reader = new FileReader;
reader.onload = function () {
img.src = reader.result;
}
reader.readAsDataURL(call.files[0]);
}
limitInput = 10;
for (i = 1; i <= limitInput; i++) document.write("<input type=file accept=image/* onchange=imgCall(image_" + i + ",this)><img id=image_" + i + " style=width:120px>" + (i == limitInput ? "" : "
"));
</script></p>
<p>
로그인 후 평가할 수 있습니다
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인