<input type="file" onchange="readURL(this);" accept=".jpg, .png" multiple/>
//img태그 사용시
function readURL(input) {
const su = input.files.length;
for(let su2=0; su2 < su; su2++){
if (input.files[su2]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#blah'+su2).attr('src', e.target.result);
}
reader.readAsDataURL(input.files[su2]);
}
}
}
//background 사용시
function readURL(input) {
const su = input.files.length;
for(let su2=0; su2 < su; su2++){
if (input.files[su2]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#blah'+su2).css({'background':' url('+e.target.result+') no-repeat center','background-size':'100%'});
}
reader.readAsDataURL(input.files[su2]);
}
}
}
참고
javascript - Preview an image before it is uploaded - Stack Overflow
'JAVASCRIPT' 카테고리의 다른 글
페이지 새로고침 시 GET 파라미터 제거 (0) | 2022.02.23 |
---|---|
새로고침 방지하기 (0) | 2022.02.23 |
class와 object (0) | 2022.01.30 |
parameters (0) | 2022.01.24 |
function (0) | 2022.01.24 |