코딩 공부/JS

[script] - 이미지 썸네일 하나에서 여러개 처리

hg_96 2022. 1. 11. 14:57
<div style="float: left">
	최근 이미지 미리보기  <img id=""/>
</div>

 <input type="file" class="" accept="image/*">
		var sel_file;
        $(document).ready(function() {
            $(".input클래스").on("change", handleImgFileSelect);
        });

        function handleImgFileSelect(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) {
                    $("#썸네일영역아이디").attr("src", e.target.result);
                }
                reader.readAsDataURL(f);
            });
        }