JS FileReader onloadend, похоже, вызывает перенаправление

Question

Я работаю над проектом с интенсивным интерфейсом, который читает и анализирует CSV через новый FileReader. Здесь виновный блок кода, от того, что я предположил, благодаря Dev Tools:

function parseCSVs() { 
    let fileUpload = document.getElementById('file-input') 

    if(fileUpload.files.length) { 
    let fileReader = new FileReader(), 
     varLabels = varAssigner.querySelectorAll('input'); 

    function _addUntilFull(i) { 
     fileReader.readAsText(fileUpload.files[i]) 
     fileReader.onloadend = function() { 
     addVar(varLabels[i].value, csvToMatrix(fileReader.result)) 

     if(varList.length == fileUpload.files.length) { 
      return; 
     } else { 
      _addUntilFull(i + 1) 
     } 
     } 
    } 
    _addUntilFull(0) 
    } 

Preserved console messages

После сохранения журналов (см рисунок выше), я обнаружил, что консоль была фиксируя все правильные сообщения (заставив меня думать, что мои функции работают нормально), но документ очистит/перезагрузится после завершения подачи и разбора файла, и в журналах будет указано «Навигация по файлу: /// etc/etc», так что эта проблема, скорее всего, от непредвиденного поведения со стороны объектов FileReader или ввода [type = "file"]. Я не могу найти что-либо в документации MDN о FileReader или других онлайн-форумах, которые объясняли бы, почему это происходит. Пожалуйста помоги! Это была такая головная боль -_- Спасибо!

Answer 1

Я действительно понял, в чем проблема, и это не имело никакого отношения к вышеуказанному блоку кода ... Кнопка, вызвавшая функцию parseCSVs, находилась внутри формы, и хотя я удалил «действие» и «метод» атрибутов формы, и кнопка не имела «типа», кнопка запускала перенаправление после запуска функции onclick. Я также проверил тест на форме и кнопке без атрибутов в HTML-файле с голой костью и обнаружил то же поведение, что и выше. Переключение элемента на предотвращение перенаправления и исправление проблемы: