Problème de valeur de variables

Histoire de portée, utilser des closures ?

a marqué ce sujet comme résolu.

Bonsoir,

J’utilise jQuery. J’aimerais appliquer une fonction liée à un évenement à un grand nombre d’élément, et pour cela, j’utilise une boucle. Mon code est le suivant:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
for (var i = 1; i < 9; i++) {
        for (var j = 0; j < 9; j++) {
            $('#' + parseInt(i) + parseInt(j)).keypress(function(e) {
                switch (e.keyCode) {
                    // Ici i vaut toujours 9
                }
            });
        }
    }
});

Mon souci est le suivant: dans la fonction appelée par l’événement, i et j ne correspondent pas aux valeurs que je souhaiterais. Après avoir un peu cherché, j’ai trouvé qu’il fallait apparemment utiliser des closures. J’ai essayé, mais sans succès.

Si quelqu’un pouvait m’aider… Merci !

Y’a une dizaine de solutions à ceci (tu peux scoper i et j avec let, tu peux utiliser bind, etc), mais aucune ne sera plus intelligente que refactorer ton code.

Tu n’as pas besoin 100 fonctions différentes. Tu peux par exemple mettre une classe sur les éléments pour les sélectionner tous au lieu de les sélectionner individuellement avec un ID. Ensuite il te suffit de récupérer l’ID dans la fonction anonyme que tu passes à keypress.

+2 -0

Lorsque je souhaite avoir une valeur fixe par element, j’utilise la fonction "data" de jQuery.

Donc tu n’auras plus besoin d’appeler keypress dans une boucle, mais juste fixer la valeur.

1
2
3
4
5
6
7
8
$("div.maclass").keypress(fonction(e) {
  $(this).data("i"); // toujours i
});
for (var i = 1; i < 9; i++) {
  for (var j = 0; j < 9; j++) {
    $('#' + parseInt(i) + parseInt(j)).data("i", i);
  }
}

Lorsque je souhaite avoir une valeur fixe par element, j’utilise la fonction "data" de jQuery.

A-312

Modifier le DOM pour ça, c’est (très) loin d’être optimisé.


Autant savoir plus précisément ce qu’il y a à faire dans cet événement :

  • est-ce qu’il y a vraiment besoin de ces variables i et j ?
  • pourquoi appliquer autant de listeners quand on pourrait déléguer ?
  • autant utiliser une class pour récupérer nos éléments plutôt que des id (pas besoin de boucle, donc) comme l’indique victor
  • à quoi sert parseInt quand on sait d’avance que la variable est un entier et qu’en plus on va la caster en string ?

Je ne sais pas, c’est ce que j’ai cru comprendre dans son problème. En effet, il peut récupérer directement l’id puis utiliser une expression régulière et le tour est joué.

Mais cette portion de code est peut-être simplement un exemple d’un problème/utilisation plus complexe.

+0 -0

Au final, j’ai effectivement rajouté une classe à mes cases pour pouvoir toutes les sélectionner avec jQuery, et je récupère l’id avec la fonction attr() de jQuery. Ça change la façon dont j’attaquais le problème lors de mon post initial; ce qui m’embêtais vraiment à ce moment, c’est que je n’arrivais pas à avoir les valeurs correctes de i et j dans ma callback…

Connectez-vous pour pouvoir poster un message.
Connexion

Pas encore membre ?

Créez un compte en une minute pour profiter pleinement de toutes les fonctionnalités de Zeste de Savoir. Ici, tout est gratuit et sans publicité.
Créer un compte