Показывать Preloader во время выполнения функции JavaScript

Рейтинг: 0Ответов: 1Опубликовано: 28.02.2023

Мне нужно показывать прелоудер, пока выполняется определенная функция на JS. Показывать его нужно вместо основного контента. Помогите, пожалуйста, я не работаю с JS. Таких страниц у меня будет много, где нужно будет реализовать лоудер, может быть вы подскажете универсальный вариант, который можно будет легко прикрутить к разным страницам. Спасибо заранее всем

<div id="preloader"></div>
<div class="card">
    //основной контент, который нужно скрывать во время работы лоудера
</div>

<script type="text/javascript">

    function uploadFile(upload) {
    //функция, во время выполнения которой нужно крутить лоудер
    }

</script>
c# javascript razor
Источник: Stack Overflow на русском

Ответы

▲ 1Принят

Прикольная штука для такого calback function

<div id="preloader"></div>
<div class="card">
    //основной контент, который нужно скрывать во время работы лоудера
</div>

<script type="text/javascript">

    function uploadFile(upload) {
    //функция, во время выполнения которой нужно крутить лоудер
    
      return;
    }
    
    function preloader_calback(calback) {
      document.querySelector('#preloader').classList.add('active')
      calback();
      document.querySelector('#preloader').classList.remove('active')
    }
    
    //Теперь запускать можно так 
    //preloader_calback(uploadFile);

</script>