Как загрузить несколько аудиофайлов в JsZip

Я хочу загрузить все аудиофайлы из папки, но этот код загружает только последний файл в папке.

var element = document.getElementById("songs");

      var audionum = element.getElementsByTagName('audio').length;

      var zipcounter = 0;

      var zip = new JSZip();

      var zipName = 'Test.zip';

      for(var i = 0; i < audionum; i++){
        var audiosrc  = document.getElementsByTagName('source')[i].getAttribute("src");
        var audiosrcsplit = audiosrc.split('/')[1];        
        // loading a file and add it in a zip file
        JSZipUtils.getBinaryContent(audiosrc, function (err, data) {
           if (err) {
              throw err; // or handle the error
           }
           zip.file(audiosrcsplit, data, {binary:true});
           zipcounter++;
           if (zipcounter == audionum) {
             zip.generateAsync({type:'blob'}).then(function(content) {
                saveAs(content, zipName);
           });
          }
        });
      }

Можете ли вы попробовать изменить var audiosrc на let audiosrc и var audiosrcsplit на let audiosrcsplit?

Shoejep 13.12.2020 13:33
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
1
189
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Для ES6 вы можете попробовать заменить var на let (область действия блока).

Если вы используете ES5, попробуйте что-то вроде ниже.


var element = document.getElementById("songs");
var audionum = element.getElementsByTagName('audio').length;
var zipcounter = 0;
var zip = new JSZip();
var zipName = 'Test.zip';
function addToZip(audiosrc, audiosrcsplit) {
    JSZipUtils.getBinaryContent(audiosrc, function (err, data) {
        if (err) {
            throw err; // or handle the error
        }
        zip.file(audiosrcsplit, data, {
            binary: true
        });
        zipcounter++;
        if (zipcounter == audionum) {
            zip.generateAsync({
                type: 'blob'
            }).then(function (content) {
                saveAs(content, zipName);
            });
        }
    });
}
for (var i = 0; i < audionum; i++) {
    var audiosrc = document.getElementsByTagName('source')[i].getAttribute("src");
    var audiosrcsplit = audiosrc.split('/')[1]; // loading a file and add it in a zip file
    addToZip(audiosrc, audiosrcsplit);
}

Спасибо, я изменил var на let, и теперь это работает.

Panakvina321 14.12.2020 15:21

Другие вопросы по теме