Variable perdue quelque part?

Question

Je donne les résultats suivants:

var element = $(this); 
var divName = element.parents("div:eq(0)").attr("name"); 
$.each(boxInfo,function(i,n) { 
    if(n.boxName == divName) 
    { 
     var newHeight = n.boxHeight; 
    } 
}); 

clicked.parents("div:eq(0)").animate({ 
    height: newHeight + 'px' 
}, 1000); 

problème étant "newHeight undefined". Mais si je le fais:

var element = $(this); 
var divName = element.parents("div:eq(0)").attr("name"); 
$.each(boxInfo,function(i,n) { 
    if(n.boxName == divName) 
    { 
     alert(n.boxHeight); 
     var newHeight = n.boxHeight; 
    } 
}); 

clicked.parents("div:eq(0)").animate({ 
    height: newHeight + 'px' 
}, 1000); 

il retourne la hauteur. Comment est-ce que 5 lignes vers le bas de la variable est indéfinie?

Answer 1

Votre variable nommée newHeight est déclarée à l'intérieur d'une fonction anonyme (la fonction qui est passée en paramètre à $.each). Cela signifie que sa valeur n'est disponible que dans cette fonction anonyme. Ce concept est appelé scope. Il explique pourquoi votre variable n'est pas définie en dehors de cette fonction anonyme.

Si vous avez modifié votre code pour déclarer la variable dans une étendue plus large, votre code se comportera comme prévu. Observer:

var element = $(this); 
var divName = element.parents("div:eq(0)").attr("name"); 
var newHeight; 
$.each(boxInfo,function(i,n) { 
    if(n.boxName == divName) 
    { 
     newHeight = n.boxHeight; 
    } 
}); 

clicked.parents("div:eq(0)").animate({ 
    height: newHeight + 'px' 
}, 1000); 

Answer 2

La portée de newheight est limitée à la fonction anonyme que vous appliquez à chaque info box. vous devez supprimer le var avant newheight pour le rendre global.

aussi, votre code n'est pas aussi efficace qu'il pourrait l'être puisque vous semblez utiliser each() pour faire quelque chose qui jquery pourrait faire pour vous, par exemple, $(boxInfo).find('[boxName=' + divName + ']')