jQuery itératif sur une fonction

Question

Assez nouveau à jquery et ayant un peu de problème avec une fonction que j'ai écrite, très similaire à this problème, et si c'est quelque chose à continuer alors apparemment, j'ai un problème de fermeture. Comme Peter Bailey l'a mis dans le fil ci-dessus, voici ce qui se passe:

1. itérer sur certaines valeurs
2. Définir/Assign une fonction dans cette itération qui utilise des variables itérées
3. Vous apprenez que toutes les utilisations de la fonction seulement les valeurs de la dernière itération.
4. WTF?

Ceci est mon code:

var pages=['home', 'about', 'events', 'info', 'qa', 'photos', 'contact']; 

for (i in pages) { 

    $link='"'+"[href$='gaction.php?page="+(pages[i])+"']"+'"'; 
    $source="/images/"+(pages[i])+".png"; 

    $($link).hoverIntent(function() { 
     $('#logo_text').stop(true, true).fadeOut(
     0, 
     function() { 
      $('#logo_text').attr('src', $source).fadeIn('slow'); // swaps logo 
     }); 
    }, function() { 
     $('#logo_text').stop(true, true).pause(300).fadeOut(
     0, 
     function() { 
      $('#logo_text').attr('src', '/images/name.png').fadeIn('slow'); //swaps back 
     }); 
    }); 
} 

Je sais que la définition de lien $ est assez désordonné, mais que les travaux de bits.

La fonction est destinée à remplacer l'image dans #logo_text par une en fonction du lien qui est survolé, mais à la fin de chaque lien change l'image pour le «contact» (le dernier).

N'a pas vraiment comprendre comment résoudre le problème de l'autre thread, donc si quelqu'un peut aider ce serait génial!

Answer 1

Vous pouvez simplement utiliser l'instruction jQuery.each, et par sa structure même crée une fermeture. Ensuite, assurez-vous de déclarer les variables avec var et vous serez tous ensemble:

var pages=['home', 'about', 'events', 'info', 'qa', 'photos', 'contact']; 

$.each(pages, function(){ 
    var $link='"'+"[href$='gaction.php?page="+ this +"']"+'"'; 
    var $source="/images/"+ this +".png"; 

    ... rest of function untouched 

}); 

Il y a quelques façons de réécrire la fonction, mais en toute honnêteté, si le vôtre travaille pour vous (les sélecteurs) vous sont bonnes. Seulement, au lieu d'utiliser fadeOut(0, function ...) il suffit d'utiliser hide().attr('src', $source).fadeIn('slow')