Maison > interface Web > js tutoriel > le corps du texte

Comment utiliser ajax pour demander au serveur d'inviter le chargement lors du chargement d'une liste de données

韦小宝
Libérer: 2018-01-01 19:43:52
original
2332 Les gens l'ont consulté

L'éditeur suivant vous proposera un article sur la façon d'utiliser ajax pour demander au serveur de charger une liste de données et d'inviter le chargement. L'éditeur pense que c'est plutôt bien, je vais donc partager le code source ajax avec vous maintenant comme référence. Suivons l'éditeur pour voir comment utiliser ajax pour demander au serveur de charger la liste de données

Nous utilisons weui.loading dans weui.js comme effet, et les méthodes beforeSend et complete d'ajax pour créer un. chargement Les données mettront quelques secondes à se charger...

Le fichier JS qui doit être chargé sur la page :

< ;script src=" ../js/libs/weui.min.js">

Vous pouvez le télécharger depuis la documentation de weui Voici sa démo : https://weui. io/weui.js/

Ici, nous parlons principalement de jQuery ajax get. Lors de l'interrogation de données, sa structure est :


$.ajax({
  type: &#39;get&#39;,
  url: url,
  data: data,
  dataType: &#39;json&#39;,
  contentType: &#39;apllication/json; charset=utf-8&#39; ,
  //数据加载前调用的方法 beforeSend()
  beforeSend: function(data){
   //这里判断,如果没有加载数据,会显示loading    
   if(data.readyState == 0){ 
     weui.loading(&#39;loading&#39;);   
   }
  },
  //数据加载成功调用的方法 sucess()
  sucess: function(data){
    //这里写数据加载成功后,会执行的代码
  },  
  //数据加载成功后调用的方法  complete()
  complete: function(data){
    //这里判断,数据加载成功之后,loading 隐藏
    if(data.status == 200){
      setTimeOut(function(){
        weui.loading(&#39;loading&#39;).hide();
      },500);
    }
  },
  //数据加载错误后调用的方法 error()
  error: function(data){
    weui.topTips(&#39;数据加载失败!&#39;);
  }
})
Copier après la connexion


La méthode ci-dessus consistant à utiliser habilement ajax pour demander au serveur de charger une liste de données et à demander la méthode de chargement est tout le contenu partagé par l'éditeur. J'espère qu'il pourra vous donner une référence, et j'espère que vous le ferez. prend en charge le site Web PHP chinois.

Recommandations associées :

Exemples détaillés d'implémentation ajax de la fonction de chargement des données

Exemples d'utilisation d'ajax

Exemple détaillé de la façon de traiter les données après la soumission d'ajax à l'arrière-plan Java

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal