Ajax-Methode zum Implementieren des Ladefortschrittsbalkens

Dieser Artikel stellt Ihnen hauptsächlich die Wirkung des Ajax-Ladefortschritts vor. Er ist sehr gut und hat Referenzwert. Ich hoffe, er kann jedem helfen.

ajax beforeSend:

Lassen Sie uns zuerst über beforeSend sprechen, das ausgeführt wird, bevor die Anfrage gesendet wird. Beispielsweise kann festgestellt werden, ob der Benutzer angemeldet ist. Wenn Wenn dies nicht der Fall ist, stoppen Sie die Anfrage und fordern Sie dazu auf.

  $.ajax({
    url : 'my_action',
    dataType: 'script',
    beforeSend : function(xhr, opts){
      if(1 == 1) //just an example
      {
        xhr.abort(); // 停止请求
      }
    },
    complete: function(){
      console.log('DONE');
    }
  });

$.ajax verfügt über einen vollständigen Parameter: function(){} wird nach Abschluss der Anforderung ausgeführt und kann zur Anzeige des Fortschrittsbalkens mit beforeSend verwendet werden

Zum Beispiel:

   $.ajax({
        url : 'my_action',
        dataType: 'script',
        beforeSend : function(){
          // 设置 进度条到20%慢慢变到50%
        },
        complete: function(){
          // 设置 进度条到80%
        }
        success：function(){
          // 渲染页面
          // 进度到100%
        }
      });

Dies ist nur der Fortschrittsbalken auf der Oberfläche, der den ungefähren Fortschritt anzeigt, nicht den tatsächlichen Ladefortschritt.

Verwandte Empfehlungen;

Codefreigabe zum Implementieren des Fortschrittsbalkens beim Laden von Webseiten

H5-Canvas-Implementierung eines kreisförmigen dynamischen Ladefortschrittsbeispiels

Implementierung des Fortschrittsbalkens für das Laden von HTML5/CSS3-Webseiten, des Download-Fortschrittsbalkens und anderer klassischer Fälle

Das obige ist der detaillierte Inhalt vonAjax-Methode zum Implementieren des Ladefortschrittsbalkens. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!