Comment charger plus de données lors du défilement uniquement lorsqu'une division spécifique est visible ?

jQuery : Charger plus de données sur Scroll

Comprendre comment implémenter le chargement de données supplémentaires dès qu'un div spécifique (. chargement) devient visible peut être une technique précieuse. Dans ce scénario, il existe plusieurs div .loading dans une liste déroulante et la tâche consiste à lancer le chargement des données uniquement pour le div actuellement visible.

Pour déterminer si un div .loading est visible, jQuery propose une solution fiable. En utilisant la fonction de défilement, vous pouvez surveiller la position de défilement de l'utilisateur et déterminer quand il atteint le bas d'une page.

Voici comment cela fonctionne :

1. Implémenter un écouteur d'événement de défilement :

   $(window).scroll(function() {
       // Your code here
   });

2. Vérifier si vous avez atteint la fin :

   if($(window).scrollTop() == $(document).height() - $(window).height()) {
       // Fetch and Append New Data
   }

3. Récupérer et ajouter de nouvelles données (à l'intérieur de l'instruction if) :

   // Make an AJAX call to retrieve new data
   // Append the retrieved data to the visible .loading div

En implémentant cette technique, vous pouvez charger efficacement plus de données uniquement lorsqu'un fichier . le chargement de div devient visible pendant le défilement, garantissant une expérience utilisateur transparente et réactive.

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!