За последние 24 часа нас посетили 17563 программиста и 1677 роботов. Сейчас ищут 1986 программистов ...

Отображение картинок

Тема в разделе "JavaScript и AJAX", создана пользователем hust0, 8 сен 2017.

  1. hust0

    hust0 Активный пользователь

    С нами с:
    6 июл 2013
    Сообщения:
    321
    Симпатии:
    8
    Здравствуйте, не могу понять почему когда я загружаю к примеру 3 картинки (через Multiple), то в превью они отображаются не по порядку как я выбрал. Т.е. 2,1,3

    Как можно сделать чтобы отображались по порядку то что я выбрал через CTR ? (1,2,3)

    Код (Javascript):
    1. $(function() {
    2.  
    3.     var imagesPreview = function(input, placeToInsertImagePreview) {
    4.  
    5.         if (input.files) {
    6.             var filesAmount = input.files.length;
    7.  
    8.             for (i = 0; i < filesAmount; i++) {
    9.                 var reader = new FileReader();
    10.  
    11.                 reader.onload = function(event) {
    12.             var hrava = Math.random();
    13.                     $($.parseHTML('........')).attr('src', event.target.result).appendTo(placeToInsertImagePreview);
    14.  
    15.                 }
    16.     reader.readAsDataURL(input.files[i]);
    17.             }
    18.         }
    19.  
    20.     };
    21.  
    22.     $('#gallery-photo-add').on('change', function() {
    23.         imagesPreview(this, 'div.gallery');
    24.     });
    25. });
     
  2. Deonis

    Deonis Старожил

    С нами с:
    15 фев 2013
    Сообщения:
    1.521
    Симпатии:
    504
    А собственно никак. По ходу, нет даже события с помощью которого можно бы было отслеживать выбор очередного файла, а сборщик браузера принимает сразу пачку файлов без учета порядка выбора и сортирует их ориентируясь на сортировку в файлов в директории. А тому же хрому, вообще по баробану и он сортирует в алфавитном порядке
     
    #2 Deonis, 8 сен 2017
    Последнее редактирование: 8 сен 2017
  3. hust0

    hust0 Активный пользователь

    С нами с:
    6 июл 2013
    Сообщения:
    321
    Симпатии:
    8
    по сути разобрал, что код выводи первые загруженные фотографии, это делает .onload
    выход такой, надо загруженные фотки внести в массив и потом уже выводит (типа дождаться все фотки) и целиком вывести. Вот вопрос только как....
     
  4. Deonis

    Deonis Старожил

    С нами с:
    15 фев 2013
    Сообщения:
    1.521
    Симпатии:
    504
    @hust0, это не решает вашу проблему. Вы смотрите на вывод, а я говорю о том порядке файлов, который будет в объекте FileList. Сделайте вывод этого объекта в консоль и вы увидите, что сортировка файлов будет всегда одинаковой и не будет зависеть от того, в каком порядке вы их выбирали.
     
    #4 Deonis, 8 сен 2017
    Последнее редактирование: 8 сен 2017
  5. hust0

    hust0 Активный пользователь

    С нами с:
    6 июл 2013
    Сообщения:
    321
    Симпатии:
    8
    что то не получается, можете помочь?
     
  6. Deonis

    Deonis Старожил

    С нами с:
    15 фев 2013
    Сообщения:
    1.521
    Симпатии:
    504
    Чем именно?
     
  7. hust0

    hust0 Активный пользователь

    С нами с:
    6 июл 2013
    Сообщения:
    321
    Симпатии:
    8
    как это сделать
     
  8. Deonis

    Deonis Старожил

    С нами с:
    15 фев 2013
    Сообщения:
    1.521
    Симпатии:
    504
    Если о том, как вывести в консоль, то:
    Код (Javascript):
    1. $('#gallery-photo-add').on('change', function() {
    2.   console.log(this.files);
    3. });
    4. // или, чтобы быстрее увидеть результат
    5. $('#gallery-photo-add').on('change', function() {
    6.   console.log([].map.call(this.files, (el) => el.name));
    7. });
    А в остальном, у меня нет способов решить вашу проблему