[Erledigt] onclick-event per Array in Schleife verwenden - Seite 2

fab · 02.09.2010, 11:51

In der Schleife definierst du nur die Funktion, exakt so wie geschrieben. Wenn die Funktion dann aufgerufen wird, wird x aus dem global scope benutzt, da die Schleife zu dem Zeitpunkt durchgelaufen ist, ist das eben 2.

Arne Drews · 02.09.2010, 11:51

Aktueller Code (lediglich Variablennamen und Linknamen verändert):

Code:

var targets = new Array('ziel1', 'ziel2');
var links = new Array(document.getElementById('link1'), document.getElementById('link2'));

for(var x=0; x<links.length; x++) {
  links[x].onclick = function() { window.location = targets[x]; };
}

und auch mit window.location.href kommt dennoch undefined.
Ich such auch schon im Netz weiter...

Aber danke Dir für Dein Kopfzerbrechen.

Öhmmm... @fab
Soweit is mir das klar. Aber er muss doch in der Schleife z.B. zum Zeitpunkt x=1 folgendes interpretieren:

Code:

links[1].onclick = function() { window.location = targets[1]; };

Asipak · 02.09.2010, 11:53

Zitat:

In der Schleife definierst du nur die Funktion, exakt so wie geschrieben. Wenn die Funktion dann aufgerufen wird, wird x aus dem global scope benutzt, da die Schleife zu dem Zeitpunkt durchgelaufen ist, ist das eben 2.

Ah, macht Sinn und erklärt damit auch dein Problem, Arne.

[edit]

Zitat:

Soweit is mir das klar. Aber er muss doch in der Schleife z.B. zum Zeitpunkt x=1 folgendes interpretieren:

Code:

links[1].onclick = function() { window.location = targets[1]; };

Dort steht nach dem Durchlaufen der Schleife aber offenbar folgendes:

Code:

links[0].onclick = function() { window.location = targets[x]; };
links[1].onclick = function() { window.location = targets[x]; };

Das ist das Problem.

fab · 02.09.2010, 11:58

Zitat:

Zitat von Arne Drews

Öhmmm... @fab
Soweit is mir das klar. Aber er muss doch in der Schleife z.B. zum Zeitpunkt x=1 folgendes interpretieren:

Code:

links[1].onclick = function() { window.location = targets[1]; };

Nein, das ist dir nicht klar, denn zu dem Zeitpunkt wird überhaupt nichts interpretiert.

Edit: Eine Lösung könnte so aussehen (ungetestet)

Code:

var targets = new Array('ziel1', 'ziel2');
var links = new Array(document.getElementById('link1'), document.getElementById('link2'));
var createOnClick = function(index) { var target = targets[index]; return function() { window.location.href = target; } };
for(var x=0; x<links.length; x++) {
  links[x].onclick = createOnClick(x);
}

Arne Drews · 02.09.2010, 12:02

Oh man...

Klar fab, Du hast recht!

Verdammt, hast Du vielleicht noch'n Verbesserungsvorschlag?
Ah so, hast schon ne Idee. Probier ioch gleich mal. Danke!

Arne Drews · 02.09.2010, 12:13

Leider auch so nicht.
Es wird nun direkt nach dem Laden die Funktion ausgeführt.
Das OnClick wird ignoriert.

Schade. Ich schau weiter!
Danke!

fab · 02.09.2010, 12:21

Komisch, ich habs mal so getestet:

Code:

<html>
<body>
<a id="link1">link 1</a>
<a id="link2">link 2</a>
<script type="text/javascript">
	var targets = new Array('ziel1', 'ziel2');
	var links = new Array(document.getElementById('link1'), document.getElementById('link2'));
	var createOnClick = function(index) { var target = targets[index]; return function() { alert(target); } };
	for(var x=0; x<links.length; x++) {
	  links[x].onclick = createOnClick(x);
	}
</script>
</body>
</html>

und es funktioniert. Zeig mal deinen Code, vielleicht hast du irgendwelche Klammern hinzugefügt?

Arne Drews · 02.09.2010, 13:23

Code:

var createOnClick = function(index) { var target = targets[index]; return function() { window.location.href = target; } };
for(var x=0; x<links.length; x++) {
  links[x].onclick = createOnClick(x);
}

Ich seh' da grad keinen Unterschied. Die Links sind bei mir allerdings mit createElement() erstellt worden.
Das dürfte aber keinen Unterschied machen, denke ich, denn die direkte
Zuweisung funktioniert ja...

ChrisB · 02.09.2010, 13:28

Die allgemeine Lösung für die Problematik der Variablenwerte zum Zeitpunkt der Zuweisung des Events vs. Ausführung wären Closures, siehe Organisation von JavaScripten

Alternativ könnte man den benötigten Wert auch einfach als Eigenschaft am Element selber ablegen, so dass man ihn beim Verarbeiten des Events dann dort auslesen kann.

Arne Drews · 02.09.2010, 13:48

Hi ChrisB,

Das war jetzt auch meine Idee:

Code:

function targetFile(item) { window.location.href = item; }

for(var x=0; x<links.length; x++) {
  links[x].onclick = function() { targetFile(this.name); };
}

zuvor habe ich natürlich den Elementen ein name-Attribut verpasst, z.B.:

Code:

links[0].name = targets[0];

Aber da reagiert er leidser gar nicht mehr auf Klick, sondern versucht die Funktion targetFile() bereits beim Laden der Seite aufzurufen.

EDIT
Hatte auch folgende Variante getestet:

Code:

var targetFile = function(item) { window.location.href = item; }

for(var x=0; x<links.length; x++) {
  links[x].onclick = function() { targetFile(this.name); };
}

mit gleichem Ergebnis.

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
IE8 verliert Session	Lenki	PHP-Fortgeschrittene	10	25.04.2010 01:10
Ein (Teil)Array anhand von level und depth zurückgeben.	greatcthulhu	Scriptbörse	4	16.04.2010 10:45
PHP Array in javascript verwenden	leojango	JavaScript, Ajax und mehr	7	08.04.2010 00:40
[Erledigt] array in eine Schleife bearbeiten	samij	PHP Tipps 2010	4	03.04.2010 00:58
[Erledigt] Tabellen die sich selbst referenzieren	Squall	PHP Tipps 2009	19	04.08.2009 21:33
[Erledigt] Array Sortieren	beist	PHP Tipps 2009	4	10.07.2009 08:53
[Erledigt] array sortieren		PHP Tipps 2004	17	13.05.2009 10:44
Turnierbaum aus array erstellen	kingflo	PHP-Fortgeschrittene	11	30.07.2008 11:32
Array auslesen	andrew22	PHP Tipps 2006	3	21.01.2006 23:06
Array Formatierung		PHP Tipps 2006	3	17.01.2006 19:12
Menü mit Unterpunkten	supertramp	Beitragsarchiv	7	18.10.2005 22:40
Mehrdimensionales Array in eindimensionales Array umwandeln		PHP-Fortgeschrittene	3	03.01.2005 22:31
Abfrage mit id aus anderer Tabelle	suter	PHP Tipps 2004-2	15	16.12.2004 14:25
bbcode - Classe		PHP-Fortgeschrittene	4	18.09.2004 17:30
Array mit while Schleife auslesen		PHP Tipps 2004	7	26.06.2004 19:56

02.09.2010, 11:51
fab Erfahrener Benutzer Registriert seit: 28.07.2010 Beiträge: 1.726 PHP-Kenntnisse: Fortgeschritten	In der Schleife definierst du nur die Funktion, exakt so wie geschrieben. Wenn die Funktion dann aufgerufen wird, wird x aus dem global scope benutzt, da die Schleife zu dem Zeitpunkt durchgelaufen ist, ist das eben 2. __________________ PHP Blog + Library CSS Effects + Tools


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

02.09.2010, 11:51
Arne Drews Erfahrener Benutzer Registriert seit: 22.04.2009 Beiträge: 3.341 PHP-Kenntnisse: Anfänger	Aktueller Code (lediglich Variablennamen und Linknamen verändert): Code: var targets = new Array('ziel1', 'ziel2'); var links = new Array(document.getElementById('link1'), document.getElementById('link2')); for(var x=0; x<links.length; x++) { links[x].onclick = function() { window.location = targets[x]; }; } und auch mit window.location.href kommt dennoch undefined. Ich such auch schon im Netz weiter... Aber danke Dir für Dein Kopfzerbrechen. Öhmmm... @fab Soweit is mir das klar. Aber er muss doch in der Schleife z.B. zum Zeitpunkt x=1 folgendes interpretieren: Code: links[1].onclick = function() { window.location = targets[1]; }; __________________ Phantasie ist wichtiger als Wissen, denn Wissen ist begrenzt. Probleme kann man niemals mit derselben Denkweise lösen, durch die sie entstanden sind. Albert Einstein

02.09.2010, 12:02
Arne Drews Erfahrener Benutzer Registriert seit: 22.04.2009 Beiträge: 3.341 PHP-Kenntnisse: Anfänger	Oh man... Klar fab, Du hast recht! Verdammt, hast Du vielleicht noch'n Verbesserungsvorschlag? Ah so, hast schon ne Idee. Probier ioch gleich mal. Danke! __________________ Phantasie ist wichtiger als Wissen, denn Wissen ist begrenzt. Probleme kann man niemals mit derselben Denkweise lösen, durch die sie entstanden sind. Albert Einstein

02.09.2010, 12:13
Arne Drews Erfahrener Benutzer Registriert seit: 22.04.2009 Beiträge: 3.341 PHP-Kenntnisse: Anfänger	Leider auch so nicht. Es wird nun direkt nach dem Laden die Funktion ausgeführt. Das OnClick wird ignoriert. Schade. Ich schau weiter! Danke! __________________ Phantasie ist wichtiger als Wissen, denn Wissen ist begrenzt. Probleme kann man niemals mit derselben Denkweise lösen, durch die sie entstanden sind. Albert Einstein

02.09.2010, 13:23
Arne Drews Erfahrener Benutzer Registriert seit: 22.04.2009 Beiträge: 3.341 PHP-Kenntnisse: Anfänger	Code: var createOnClick = function(index) { var target = targets[index]; return function() { window.location.href = target; } }; for(var x=0; x<links.length; x++) { links[x].onclick = createOnClick(x); } Ich seh' da grad keinen Unterschied. Die Links sind bei mir allerdings mit createElement() erstellt worden. Das dürfte aber keinen Unterschied machen, denke ich, denn die direkte Zuweisung funktioniert ja... __________________ Phantasie ist wichtiger als Wissen, denn Wissen ist begrenzt. Probleme kann man niemals mit derselben Denkweise lösen, durch die sie entstanden sind. Albert Einstein

02.09.2010, 13:28
ChrisB Moderator¹ Registriert seit: 28.03.2010 Beiträge: 7.470 PHP-Kenntnisse: Fortgeschritten	Die allgemeine Lösung für die Problematik der Variablenwerte zum Zeitpunkt der Zuweisung des Events vs. Ausführung wären Closures, siehe Organisation von JavaScripten Alternativ könnte man den benötigten Wert auch einfach als Eigenschaft am Element selber ablegen, so dass man ihn beim Verarbeiten des Events dann dort auslesen kann. __________________ RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?

02.09.2010, 13:48
Arne Drews Erfahrener Benutzer Registriert seit: 22.04.2009 Beiträge: 3.341 PHP-Kenntnisse: Anfänger	Hi ChrisB, Das war jetzt auch meine Idee: Code: function targetFile(item) { window.location.href = item; } for(var x=0; x<links.length; x++) { links[x].onclick = function() { targetFile(this.name); }; } zuvor habe ich natürlich den Elementen ein name-Attribut verpasst, z.B.: Code: links[0].name = targets[0]; Aber da reagiert er leidser gar nicht mehr auf Klick, sondern versucht die Funktion targetFile() bereits beim Laden der Seite aufzurufen. EDIT Hatte auch folgende Variante getestet: Code: var targetFile = function(item) { window.location.href = item; } for(var x=0; x<links.length; x++) { links[x].onclick = function() { targetFile(this.name); }; } mit gleichem Ergebnis. __________________ Phantasie ist wichtiger als Wissen, denn Wissen ist begrenzt. Probleme kann man niemals mit derselben Denkweise lösen, durch die sie entstanden sind. Albert Einstein Geändert von Arne Drews (02.09.2010 um 14:01 Uhr).