Отображать значок загрузки на фактическую продолжительность времени загрузки документа?

#jquery #load #icons #loading

#jquery #загрузка #Значки #Загрузка

Вопрос:

используя jQuery load или что-то подобное, можете ли вы вложить функцию внутрь функции .load() и отобразить значок загрузки в течение фактического времени загрузки файла?

Я делал похожие вещи, но я никогда не подтверждал сам с собой, что это было возможно

Ответ №1:

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

 $('#loadingImage').fadeIn();

$('#result').load('mysite/mypage', function() {
   // loading complete - callback called
   $('#loadingImage').hide();
});
  

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

1. боже, спасибо — так просто. это именно тот код, который я использую, я просто не знал, было ли то, что я пытался сделать, точным

2. это отличная особенность jQuery — simples! отметьте как ответ, пожалуйста 🙂

Ответ №2:

Вы можете отобразить значок, отправить запрос, а затем использовать обратный вызов load функции завершения, чтобы скрыть значок. Это отлично подходит для одного конкретного вызова load.

Кроме того, вы можете использовать ajaxStart и ajaxStop , чтобы сделать это для любого запроса, который вы отправляете на странице в любое время. ajaxStart запускается, когда запускается ajax-запрос, а другой в данный момент не выполняется; ajaxStop запускается, когда ajax-запрос завершается, а других невыполненных запросов нет.

Таким образом, вы могли бы иметь элемент с id «загрузкой», который изначально скрыт, и сделать это:

 $("#loading")
    .ajaxStart(function() { $(this).fadeIn();  })
    .ajaxStop( function() { $(this).fadeOut(); });
  

Смотрите связанные документы для получения подробной информации.