Question

Il y a quelque temps que j'ai posté une question sur ce questions doivent un bon codeur javascript pouvoir répondre . Meder a la question suivante:

Le code suivant fait clique sur un « un » élément pour alerter (-1) en raison du fait que « i » est de tenir dans la fonction onclick comme référence et non comme une valeur:

<a href="#">text</a><br><a href="#">link</a>
<script>
var as = document.getElementsByTagName('a');
for ( var i = as.length; i--; ) {
    as[i].onclick = function() {
        alert(i);
        return false;
    }
}
</script>
  

La question est: Comment résoudre ce problème   la mise en œuvre afin que le onclick   fonction maintient la valeur de i et non   il est fait référence?

Je ne connais pas la réponse. Comment le réparer? Comment faire i d'être une copie de la valeur de référence plutôt que la référence réelle?

Des questions secondaires: tous les types de variables sont transmises en tant que référence? Ou faut-il varier si c'est un type de primitity ou un objet?

Toutes les pensées seraient appréciés.

Était-ce utile?

La solution

Pour comprendre ce problème, vous devez apprendre ce qu'est un fermeture est. Ensuite, vous devez également savoir comment traite javascript avec la portée (il est sur une fonction de base plutôt que sur une base de bloc comme C par exemple).

Voici la solution "Stantard":

<a href="#">text</a><br><a href="#">link</a>
<script type="text/javascript">
var as = document.getElementsByTagName('a');
for ( var i = as.length; i--; ) {
    as[i].onclick = (function(i) {
        return function() {
            alert(i);
            return false;
        }
    })(i);
}
</script>

Une autre version qui fait exactement la même chose, mais peut-être plus facile à comprendre si vous n'êtes pas habitué à la fermeture et la portée de JS est:

for ( var i = as.length; i--; ) {
    as[i].onclick = (function(number) {
        return function() {
            alert(number);
            return false;
        }
    })(i);

Vous avez l'idée?

Autres conseils

<a href="#">text</a><br><a href="#">link</a>
<script>
var as = document.getElementsByTagName('a');
for ( var i = as.length; i--; ) {
    as[i].onclick = function() {
        return function() {
           alert(i);
           return false;
        }
    }();
}
</script>

peut-être?

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top