Heim > Web-Frontend > CSS-Tutorial > Hauptteil

Wie zeige ich einen Ladeindikator bei asynchronen AJAX-Anfragen an?

DDD
Freigeben: 2024-11-17 05:50:03
Original
587 Leute haben es durchsucht

How to Display a Loading Indicator During Asynchronous AJAX Requests?

Ladeanzeige bei asynchronen Anfragen anzeigen

Um den Fortschritt asynchroner Anfragen anzuzeigen, kann ein Ladebild angezeigt werden. Während die Anfrage ausgeführt wird, bleibt das Bild sichtbar und verschwindet nach Abschluss.

Verwendung der Methode zum Ausblenden/Anzeigen vor und nach der Anfrage

Ein einfacher Weg Der Ansatz besteht darin, die Sichtbarkeit des Bildes manuell zu steuern:

$('#loading-image').show();

$.ajax({
  url: uri,
  cache: false,
  success: function(html){
    $('.info').append(html);
  },
  complete: function(){
    $('#loading-image').hide();
  }
});
Nach dem Login kopieren

Verwendung von Global Ajax Ereignisse

Alternativ können Sie globale Ajax-Ereignisse verwenden, um die Sichtbarkeit des Bildes zu verwalten:

$('#loading-image').bind('ajaxStart', function(){
  $(this).show();
}).bind('ajaxStop', function(){
  $(this).hide();
});
Nach dem Login kopieren

Diese Methode stellt sicher, dass das Ladebild für alle asynchronen Anfragen einheitlich angezeigt wird.

Das obige ist der detaillierte Inhalt vonWie zeige ich einen Ladeindikator bei asynchronen AJAX-Anfragen an?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage