Comment utiliser les fermetures pour créer des auditeurs d'événements dans une boucle Javascript for?

HTML

<span class="char" id="0">?</span> <span class="char" id="1">!</span> <span class="char" id="2">"</span> <span class="char" id="3">/</span> <span class="char" id="4">%</span> <span class="char" id="5">$</span> ... 

JavaScript

 var charElems = document.getElementsByClassName('char'); for (var i=0; i < charElems.length; i++) { charElems[i].addEventListener('mouseover',function() { (function(j) {mouseoverCheck(j);}(i)); }); } 

J'ai un tas (centaines) d'éléments de span avec des nombres en tant que ID (à partir de 0 et incrémentés par 1). Ce que cette boucle est supposée faire est de créer des auditeurs de l'événement mouseover pour tous les éléments d' span (qui ont tous une classe de char ). Une fois moused over, il devrait exécuter la fonction mouseoverCheck() et passer tout ce que j'étais lorsque cet auditeur d'événement a été créé. Ainsi, le 203e auditeur d'événement devrait passer en 203 . Mais ce n'est pas le cas. À l'heure actuelle, il passe dans ce que je crois être la dernière valeur que i avant la fin de la boucle.

J'essayais d'utiliser un IIFE et une fermeture pour faire en sorte que chaque auditeur d'événement ait eu sa valeur au moment où il a été créé, au lieu de sa valeur lorsque la fonction est appelée. De toute évidence, je ne l'ai pas fait correctement, mais je suis assez certain que la fermeture est la clé de mon problème. Quelqu'un peut-il éclairer la façon de procéder correctement? Je pensais avoir compris la fermeture, mais je ne sais pas …

• Supports en fonctions Javascript
• Javascript: Lors de l'écriture d'une boucle for, pourquoi imprimer le dernier numéro d'index?
• PNG n'est pas rendu avec PhantomJS avec plusieurs tentatives en boucle
• Running Promises en série en série
• Javascript boucle un tableau pour trouver des nombres divisibles par 3

• Array de tableau à objet – javascript
• Pourquoi mon JavaScript est-il pour les éléments qui ignorent la boucle?
• Je ne peux pas comprendre ce qui ne va pas avec ma déclaration if dans JavaScript
• Un nombre aléatoire entre 1 et 4 qui n'est pas un autre nombre aléatoire
• Besoin d'une autre aide pour afficher dynamiquement le texte sur l'écran

 charElems[i].addEventListener('mouseover',function() { (function(j) {mouseoverCheck(j);}(i)); }); 

 var charElems = document.getElementsByClassName('char'); for (var i=0; i < charElems.length; i++) { charElems[i].addEventListener('mouseover', (function(temp) { return function(){ var j = temp; //mouseoverCheck(j); console.log(temp); } }(i))); } 

 var charElems = document.getElementsByClassName('char'); for (var i = 0; i < charElems.length; i++) { //close... //charElems[i].addEventListener('mouseover',function() { // (function(j) {mouseoverCheck(j);}(i)); //}); //like this (function(el, x) { el.addEventListener("mouseover", function() { mouseoverCheck(x); }); })(charElems[i], i) }