Schauen wir uns zunächst einen Code an:
Die Codekopie lautet wie folgt:
<a href = "JavaScript: void (0);"> 111 </a>
<a href = "JavaScript: void (0);"> 222 </a>
<a href = "javacsript: void (0);"> 333 </a>
var a = document.getElementsByTagName ("a");
Funktion b () {
für (var i = 0; i <A.Length; i ++) {
a [i] .onclick = function () {
Alarm (i);
}
}
}
Nach unserer ursprünglichen Absicht des Designs sollte es sein, auf ein Tag A zu klicken, um die entsprechende Seriennummer des Tags zu übertreffen, dh auf die erste A, um 0 zu erzielen, und klicken Sie auf die zweite, um 1 zu eröffnen ... aber Tatsache ist, dass die Anzahl der Tags, die A IMMER POP -UP -Pop -up -Tag, immer die Anzahl der Tags ist. Was ist der Grund? Dieses Problem hat mich schon lange beunruhigt. Ich habe viele Online -Materialien und Nachschlagewerke konsultiert. Die meisten von ihnen sind plausibel. Ich glaube, dass viele Schüler nicht viel über die Gründe wissen. Ich werde über mein Verständnis dieses Problems sprechen. Wenn es Unangemessenheit gibt, kritisieren und korrigieren Sie mich bitte.
In meinem persönlichen Verständnis ist der Grund, warum die obige Funktion ihren Zweck nicht erreicht hat, dass die Ereignisverarbeitungsfunktion die Variable I bindet und die Ereignisverarbeitungsfunktion Onclick zugewiesen wird, dh die Funktion wird nur aufgerufen, wenn das A -Tag geklickt wird. Daher wird logischerweise die Funktion () {alert (i);} in einer einfachen Schleife nicht tatsächlich ausgeführt, und wenn wir auf das A -Tag klicken, wurde die für die Schleife bereits ausgeführt. Zu diesem Zeitpunkt ist der Wert von I der endgültige Wert der für die Loop -Ausführung. Um einfach zu sein, gehört der Wert von I zur B -Funktion, und der Wert von I, den wir brauchen, ist der Wert, den die Ereignisverarbeitungsfunktion in Echtzeit übergeben hat. Gibt es also eine Möglichkeit, unsere ursprüngliche Designabsicht zu verwirklichen? Ein intelligenter Klassenkameraden hat möglicherweise vermutet, dass es sich um Schließungen handelt.
Schauen wir uns einen anderen Code an:
Die Codekopie lautet wie folgt:
var a = document.getElementsByTagName ("a");
Funktion b () {
für (var i = 0; i <A.Length; i ++) {
a [i] .onclick = function (j) {
return function () {
Alarm (j);
}
}(ich);
}
}
B();
Führen Sie den oben genannten Code aus und Sie werden feststellen, dass die von uns gewünschte Funktion implementiert wurde. Wenn Sie auf ein Tag mit einem Tag A klicken, wird die Seriennummer angezeigt, in der sich das Tag befindet. Ich glaube, dass viele Schüler viele ähnliche Versionen des obigen Code gesehen haben, aber warum können wir die Funktionen erzielen, die wir dadurch benötigen? Dies ist meine persönliche Meinung. Wenn es Unangemessenheit gibt, geben Sie mir bitte einige Ratschläge.
Das Wesen des Verständnisses des obigen Code ist das Verständnis der Variablen i. In diesem Code wird bei der Ausführung der Funktion und der For -Loop eine sofortige Anruffunktion gefunden. Zu diesem Zeitpunkt wird der Variable-Wert in Echtzeit an die sofortige Anruffunktion übergeben. Die Funktion wird sofort aufgerufen und die Ereignisverarbeitungsfunktion speichert den Echtzeit-I-variablen Wert.
Das obige dreht sich alles um diesen Artikel. Ich hoffe, es wird für das Verständnis aller für JS -Schließungen hilfreich sein.