Javascript - Onclick-Ereignis in der Schleife dynamisch zuweisen

8
___ qstnhdr ___ Javascript - Onclick-Ereignis in der Schleife dynamisch zuweisen ___ answer5040150 ___

Bedenken Sie, dass bei der Ausführung der onclick () - Funktion nur Folgendes gilt:

%Vor%

, wörtlich. Die OptionPar wird zu dem Zeitpunkt aufgelöst, an dem das Click-Ereignis ausgeführt wird, und zu diesem Zeitpunkt ist es wahrscheinlich der letzte Wert, den Sie ihm zugewiesen haben. Sie sollten es generell vermeiden, Variablen auf diese Weise zu übergeben.

Das Problem, das Sie zu lösen versuchen, wird am besten gelöst, indem Sie das Stück wie folgt neu schreiben:

%Vor%     
___ answer25310129 ___

Lesen Sie für jquery den Abschnitt zum Hinzufügen von Ereignisdaten aus der API :

%Vor%     
___ answer36983545 ___

Die angenommene Antwort scheint zu funktionieren, scheint aber verwirrend zu sein und eine etwas umständliche Art, dies zu tun. Ein besserer Weg wäre vielleicht, das Datenattribut für das Element zu verwenden, nach dem Sie den Ereignislistener suchen möchten. Es ist einfach, leicht zu verstehen und viel weniger Code. Hier ist ein Beispiel:

%Vor%     
___ answer5040146 ___

Sie müssen so etwas tun:

%Vor%     
___ answer41815872 ___

Die angenommene Antwort ist richtig, aber ich habe das Gefühl, dass keine wirkliche Erklärung gegeben wurde.

Lassen Sie mich versuchen zu erklären, das Problem hier ist klassische fehlende Schließung.

Die Variable 'i' wird um 1 pro Schleifeniteration erhöht, und das on-click-Ereignis wird tatsächlich nicht ausgeführt , unabhängig davon, ob es nur auf das a-Element angewendet wird, es fasst sich bis zur Länge von arrOptions zusammen, was 10 ist.

Also läuft die Schleife weiter bis 'i' 10 ist, Wenn dann das On-Click-Ereignis ausgelöst wird, nimmt es den Wert von i, der 10 ist.

jetzt, für die Lösung, In der Lösung verwenden wir eine Closure, so dass, wenn wir den Wert von 'i' auf das Ein-Klick-Ereignis des a-Elements anwenden, es tatsächlich den genauen Wert von i zur Zeit erhält.

Die innere Funktion des onclick-Ereignisses erzeugt eine Schließung, in der es auf den Parameter (arrOptions [i]) verweist, was bedeutet, dass die tatsächliche i-Variable zur richtigen Zeit ist.

Die Funktion schließt schließlich mit diesem Wert, und kann dann den entsprechenden Wert zurückgeben, wenn das On-Click-Ereignis ausgeführt wird.

    
___ answer29867376 ___

Sie übergeben nur die Referenz der Variablen an die Funktion, nicht ihren Wert. Jedes Mal, wenn die Schleife iteriert wird, weist sie Ihrer anonymen Funktion einen Verweis zu und alle verweisen auf denselben Wert im Speicher. Da Sie jedoch denselben Variablennamen in der Schleife verwenden, überschreiben Sie den Wert der Variablen. Sie können die Variable mit einer Zeichenfolge verketten, um den Wert beizubehalten. Zum Beispiel so:

%Vor%

Der erste Parameter ist der Name der Funktion, aber afaik ist optional (er kann leer gelassen oder weggelassen werden).

    
___ tag123html ___ HTML (Hyper Text Markup Language) ist die Standard-Auszeichnungssprache, die zum Strukturieren von Webseiten und zum Formatieren von Inhalt verwendet wird. HTML beschreibt die Struktur einer Website semantisch zusammen mit Hinweisen für die Präsentation, wodurch sie eine Markup-Sprache statt einer Programmiersprache wird. Die neueste Revision der HTML-Spezifikation ist HTML5.2. ___ tag123button ___ Schaltflächen sind einfache Elemente in grafischen Benutzeroberflächen, die Mausklicks oder Fingertipps (auf mobilen Geräten) als Eingabe verwenden. ___ tag123events ___ Ein Ereignis ist eine Möglichkeit für eine Klasse, Benachrichtigungen an Listener zu senden, wenn eine bestimmte Sache passiert. ___ tag123onclick ___ Ein Ereignis, das auftritt, wenn ein Benutzer auf ein Objekt klickt. Es ist eine Kombination von zwei Ereignissen, nämlich "onmousedown" und "onmouseup". ___ tag123javascript ___ JavaScript (nicht zu verwechseln mit Java) ist eine dynamische Sprache mit mehreren Paradigmen auf hoher Ebene, die sowohl für das clientseitige als auch für das serverseitige Scripting verwendet wird. Verwenden Sie dieses Tag für Fragen zu ECMAScript und seinen verschiedenen Dialekten / Implementierungen (außer ActionScript und Google-Apps-Script). ___ answer24811690 ___

Ich füge einen Event-Handler an:

%Vor%

kann alles aus dem Element abrufen, das das Ereignis ausgelöst hat:

%Vor%

In diesem Fall müssen Sie die Option in das Element / Tag einbetten. In meinem Fall benutze ich die ID.

    
___
ihorko 18.02.2011, 10:19
quelle

7 Antworten

28

Sie müssen so etwas tun:

%Vor%     
Jacob Relkin 18.02.2011, 10:26
quelle
2

Bedenken Sie, dass bei der Ausführung der onclick () - Funktion nur Folgendes gilt:

%Vor%

, wörtlich. Die OptionPar wird zu dem Zeitpunkt aufgelöst, an dem das Click-Ereignis ausgeführt wird, und zu diesem Zeitpunkt ist es wahrscheinlich der letzte Wert, den Sie ihm zugewiesen haben. Sie sollten es generell vermeiden, Variablen auf diese Weise zu übergeben.

Das Problem, das Sie zu lösen versuchen, wird am besten gelöst, indem Sie das Stück wie folgt neu schreiben:

%Vor%     
Pawel Veselov 18.02.2011 10:26
quelle
1

Ich füge einen Event-Handler an:

%Vor%

kann alles aus dem Element abrufen, das das Ereignis ausgelöst hat:

%Vor%

In diesem Fall müssen Sie die Option in das Element / Tag einbetten. In meinem Fall benutze ich die ID.

    
Günter 17.07.2014 19:15
quelle
1

Lesen Sie für jquery den Abschnitt zum Hinzufügen von Ereignisdaten aus der API :

%Vor%     
Roman 14.08.2014 14:06
quelle
1

Die angenommene Antwort scheint zu funktionieren, scheint aber verwirrend zu sein und eine etwas umständliche Art, dies zu tun. Ein besserer Weg wäre vielleicht, das Datenattribut für das Element zu verwenden, nach dem Sie den Ereignislistener suchen möchten. Es ist einfach, leicht zu verstehen und viel weniger Code. Hier ist ein Beispiel:

%Vor%     
ray_voelker 02.05.2016 13:23
quelle
1

Die angenommene Antwort ist richtig, aber ich habe das Gefühl, dass keine wirkliche Erklärung gegeben wurde.

Lassen Sie mich versuchen zu erklären, das Problem hier ist klassische fehlende Schließung.

Die Variable 'i' wird um 1 pro Schleifeniteration erhöht, und das on-click-Ereignis wird tatsächlich nicht ausgeführt , unabhängig davon, ob es nur auf das a-Element angewendet wird, es fasst sich bis zur Länge von arrOptions zusammen, was 10 ist.

Also läuft die Schleife weiter bis 'i' 10 ist, Wenn dann das On-Click-Ereignis ausgelöst wird, nimmt es den Wert von i, der 10 ist.

jetzt, für die Lösung, In der Lösung verwenden wir eine Closure, so dass, wenn wir den Wert von 'i' auf das Ein-Klick-Ereignis des a-Elements anwenden, es tatsächlich den genauen Wert von i zur Zeit erhält.

Die innere Funktion des onclick-Ereignisses erzeugt eine Schließung, in der es auf den Parameter (arrOptions [i]) verweist, was bedeutet, dass die tatsächliche i-Variable zur richtigen Zeit ist.

Die Funktion schließt schließlich mit diesem Wert, und kann dann den entsprechenden Wert zurückgeben, wenn das On-Click-Ereignis ausgeführt wird.

    
john Smith 23.01.2017 21:21
quelle
0

Sie übergeben nur die Referenz der Variablen an die Funktion, nicht ihren Wert. Jedes Mal, wenn die Schleife iteriert wird, weist sie Ihrer anonymen Funktion einen Verweis zu und alle verweisen auf denselben Wert im Speicher. Da Sie jedoch denselben Variablennamen in der Schleife verwenden, überschreiben Sie den Wert der Variablen. Sie können die Variable mit einer Zeichenfolge verketten, um den Wert beizubehalten. Zum Beispiel so:

%Vor%

Der erste Parameter ist der Name der Funktion, aber afaik ist optional (er kann leer gelassen oder weggelassen werden).

    
StanE 25.04.2015 15:51
quelle