Le principe et la mise en œuvre du chargement paresseux de jquery

Cette fois, je vais vous apporter le principe et la mise en œuvre du chargement paresseux de jquery, et quelles sont les précautions pour mettre en œuvre le chargement paresseux de jquery. Ce qui suit est un cas pratique, jetons un coup d'oeil.

Principe du chargement paresseux

1. Implémentation du code, charger dans la fenêtre actuelle :

function isVisible($node){    var winH = $(window).height(),
        scrollTop = $(window).scrollTop(),
        offSetTop = $(window).offSet().top;    if (offSetTop < winH + scrollTop) {        return true;
    } else {        return false;
    }
}

2 Ajouter l'événement du navigateurÉcouter <.> fonction pour permettre au navigateur de vérifier si l'élément apparaît dans la plage visible de la fenêtre à chaque fois qu'il défile :

$(window).on("scroll", function{    if (isVisible($node)){        console.log(true);
    }
})

3. Allez, Pikachu !

var hasShowed = false;
$(window).on("sroll",function{    if (hasShowed) {        return;
    } else {        if (isVisible($node)) {
            hasShowed = !hasShowed;            console.log(true);            //ajax请求刷新view层
        }
    }
})

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 faire attention au site Web php chinois

Autres articles connexes !

Lecture connexe :

Problèmes avec VUE-CLI @2.9.1 et versions ultérieures

Comment personnaliser les paramètres utilisateur dans WebStorm

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!