Explication détaillée des étapes pour implémenter la barre de progression du chargement avec Ajax

Cette fois, je vais vous donner une explication détaillée des étapes pour implémenter la barre de progression du chargement Ajax Quelles sont les précautions pour l'implémentation Ajax de la barre de progression du chargement ? Voici des cas pratiques ? , jetons un coup d'œil une fois.

ajax beforeSend:

Parlons-en avant d'envoyer d'abord. Il peut être exécuté avant que la requête ne soit envoyée. envoyé. Par exemple, il peut déterminer l'utilisateur. Êtes-vous connecté ? Sinon, arrêtez la demande et demandez.

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

$.ajax a un paramètre complete : function(){} est exécuté une fois la requête terminée. Il peut être utilisé pour afficher la barre de progression avec beforeSend

Par exemple :

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

Ceci est juste la barre de progression que vous voyez en surface, montrant la progression approximative, pas la progression réelle du chargement.

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Comment utiliser Ajax pour publier une page de renvoi de demande

Étapes détaillées d'Ajax pour le téléchargement de fichiers et de paramètres

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!