I den här snabba tipsen får jag lära dig hur du lägger till lite känsla på din sida, genom att visa en uppsättning element i följd. Medan det finns många sätt att uppnå denna uppgift, kommer vi idag att granska en teknik som använder rekursiva funktioner.
// Wrapping, self invoking funktion förhindrar globals (function () // Dölj elementen initialt var lis = $ ('li'). Hide (); // När någon ankerkod klickas. (Är super generisk här) $ ('a'). klicka (funktion () var i = 0; // FadeIn varje listobjekt över 200 ms, och // när det är färdigt, kallas rekursivt displayImages. // När eq (i) refererar till ett element som existerar inte, // jQuery returnerar ett tomt objekt och fortsätter inte // till fadeIn. (funktion displayImages () lis.eq (i ++). fadeIn (200, displayImages);) ();); ) ();
Vad som gör den här användningen effektiv är det faktum att när lis.eq (i)
hänvisar till ett element som inte existerar i den förpackade uppsättningen, kommer ett tomt jQuery-objekt att returneras. När detta händer är de efterföljande metoderna i kedjan (FadeIn
) kommer aldrig att ringas.