Подсчитайте вставленный div в цикле for

#jquery #file #input

#jquery #файл #ввод

Вопрос:

Я хочу получить общее количество divs, вставленных с помощью цикла for. Я хотел, чтобы он мог создавать функцию, которая сообщит системе, что ей необходимо создать слайдер для изображений.

Вот мой код для вставки div, когда пользователь выбирает файл изображения:

 $(document).ready(function() {
    if (window.File amp;amp; window.FileList amp;amp; window.FileReader) {
        $("#imgupload").on("change", function(e) {
            var files = e.target.files,
            filesLength = files.length;
            for (var i = 0; i < filesLength; i  ) {
                var f = files[i];
                var fileReader = new FileReader();
                fileReader.onload = (function(e) {
                    var file = e.target;
                    $("<div class=img-holder>"  
                        "<button type='button' class='img-close'><img src='../Image/icon-close.png'></button>" 
                        "<img class='upload-img' src='"   e.target.result   "'/>"  
                    "</div").insertAfter("#img-first");
                        $(".img-close").click(function(){
                        $(this).parent(".img-holder").remove();
                    });
                });
                fileReader.readAsDataURL(f);
            }
        });
    } else {
        alert("Your browser doesn't support to File API")
    }
});
  

Я пытался сделать это:

 $(document).ready(function() {
    if (window.File amp;amp; window.FileList amp;amp; window.FileReader) {
        var promises = [];
        var countimg = $("#imgupload").on("change", function(e) {
            var files = e.target.files,
            filesLength = files.length;
            for (var i = 0; i < filesLength; i  ) {
                var f = files[i];
                var fileReader = new FileReader();
                fileReader.onload = (function(e) {
                    var file = e.target;
                    $("<div class=img-holder>"  
                        "<button type='button' class='img-close'><img src='../Image/icon-close.png'></button>" 
                        "<img class='upload-img' src='"   e.target.result   "'/>"  
                    "</div").insertAfter("#img-first");
                        $(".img-close").click(function(){
                        $(this).parent(".img-holder").remove();
                    });
                });
                fileReader.readAsDataURL(f);
            }
        });
        promises.push(countimg);
        $.when.apply(null, promises).done(function(){
            alert($('.img-holder').length);
        })
    } else {
        alert("Your browser doesn't support to File API")
    }
});
  

Но это не работает. Он только предупредил 0.

Комментарии:

1. Что promises.push(countimg); должна делать строка? countimg это элемент с идентификатором imgupload , заключенный в объект jQuery.

2. предполагается, что он подсчитывает, сколько раз функция завершала это действие, потому что я не могу подсчитать div до его вставки. Я делаю это неправильно? Я новичок в этом.