Show ảnh thumbnail trước khi upload

Em muốn show ảnh thumbnail trước khi upload file thì code e như này:
<input type="file" id="main_picture" /> <img id="imageUpload" />
và js e có viết

function readURL(input) {

    if (input.files && input.files[0]) {
        var reader = new FileReader();

        reader.onload = function(e) {
            $('#imageUpload').css('display', "block");
            $('#imageUpload').attr('src', e.target.result);
        }

        reader.readAsDataURL(input.files[0]);
    }
}

$("#main_picture").change(function() {
    readURL(this);
});

Nhưng có 1 vấn đề là nếu e có 10 cái thẻ input và đều cần show thumbnail thì e phải viết 10 cái id cho từng thẻ input + img và 10 cái function js để xử lý nó như thế sẽ rất tốn thời gian và khiến code dài quá. Có cách nào mà viết js 1 lần và dùng cho 10 hoặc 100 cái thẻ input để show thumbnail không? Mấy bác cao thủ cứu em vụ này với. Em cảm ơn

Thẻ input cho phép chọn nhiều tập tin (thuộc tính multiple), việc gì phải tạo nhiều thẻ input làm gì chứ.

Còn hiện hình thì bạn tạo thẻ động, có bao nhiêu hình thì tạo bấy nhiêu thẻ img để gán hình vào.

var img = document.createElement("img");
//...
2 Likes
83% thành viên diễn đàn không hỏi bài tập, còn bạn thì sao?