Closure + Parameter in Variable speichern

hts · 28.09.2010, 18:42

Hi Leute,

ich möchte einem Event einen Parameter mitgeben. Ich denke, dazu benutzt man in Javascript Closures. Hier mal meine ersten Gehversuche dazu (Code auf das Notwendigste gekürzt):

Code:

var PieceTypes = new Array('Q', 'R', 'B', 'N');

for(var I = 0; I < PieceTypes.length; I ++)
{
        var PieceType = PieceTypes[i];
	var Image = document.createElement('img');
	
	Image.onclick = function()
	{
		var PromotionPieceType = PieceType;

		var Closure = function()
		{
			alert(PromotionPieceType);
		}

		Closure();
	}
}

In der äußeren Eventfunktion speichere ich den Parameter in var PromotionPieceType = PieceType. Bei einem Klick auf ein Bild sollte jetzt der entsprechnde Wert ('Q', 'R', 'B' oder 'N') ausgegeben werden, aber es wird immer der letzte Wert "N" ausgegeben, egal auf welches Bild ich klicke. Also scheinbar wird dieser in der Schleife überschrieben

Wie macht man es richtig?

Chriz · 28.09.2010, 19:21

Ohje Schleifen und Callbacks. Ganz unorthodox:

Code:

var PieceTypes = new Array('Q', 'R', 'B', 'N');

for(var I = 0; I < PieceTypes.length; I ++)
{
        var PieceType = PieceTypes[i];
	var Image = document.createElement('img');
        Image.data = PieceType;
	
	Image.onclick = function()
	{
		alert(this.data);
	}
}

ungetestet

hts · 28.09.2010, 19:31

Zitat:

Zitat von Chriz

Ohje Schleifen und Callbacks. Ganz unorthodox:

Code:

var PieceTypes = new Array('Q', 'R', 'B', 'N');

for(var I = 0; I < PieceTypes.length; I ++)
{
        var PieceType = PieceTypes[i];
	var Image = document.createElement('img');
        Image.data = PieceType;
	
	Image.onclick = function()
	{
		alert(this.data);
	}
}

ungetestet

Jetzt ist es getestet - funktioniert!

Coole Idee, die Daten einfach ins DOM-Element zu hängen.

Du meinst also, prinzipiel ist mein Code richtig, aber kann innerhalb einer Schleife nicht benutzt werden?

PS: Oben in meinem Code heißt es natürlich var PieceType = PieceTypes[i]; - Ich wollte es ändern, aber im Editor ist ein großes "I".
[EDIT] komisch, hier wird auch wieder ein kleines "i" gezeigt, obwohl es ein großes ist.

rudygotya · 28.09.2010, 21:50

Benutz dafür bitte ein Framework. Memory leaks sind nicht sehr schön. Siehe z.b. jquery data

hts · 28.09.2010, 23:21

Zitat:

Zitat von rudygotya

Benutz dafür bitte ein Framework. Memory leaks sind nicht sehr schön. Siehe z.b. jquery data

Ja, vermutlich hast du recht, dass ein JS-Framework einem viel Arbeit abnimmt. Aber die komische jQuery-Syntax mit dem $-Zeichen hat mich auf den ersten Blick abgeschreckt.

Code:

$('body').data('foo', 52);

Ich schreibe mir z.Z meine JS-Funktionen/Tools/Helper selbst, weil ich die Einarbeitung in ein Framework (inkl. dessem Overhead) scheue. Vermutlich investiere ich dabei mehr Zeit mit der Entwicklung und dem Testen, vor allem Cross-Browser-Testen, als in die Einarbeitung in ein FW.

Naja, vielleicht werde ich noch vernünftig (wenn es komplexer wird) ...

Chriz · 28.09.2010, 23:40

Hallo,

also wenn du dich ein bisschen mit JS auskennst ist jQuery wunderbar intuitiv. Ich kanns wirklich nur empfehlen. Das Problem beim Selberschreiben ist eben, aber das weisst du sicherlich, dass es in deinem Browser einwandfrei funktioniert, im naechsten oder sogar in einer anderen Version wiederum nicht. Aber davon erfaehrst du moeglicherweise nie, weil die User deine Seite besuchen, es nicht funktioniert, und dann wieder verschwinden.

nikosch · 29.09.2010, 16:41

PHP-Code:

  var PieceTypes = ['Q', 'R', 'B', 'N'];

for (PieceType in PieceTypes)  {
  var Image = document.createElement('img');
  
  Image.onclick = function (Type) {
      return function () {
        alert (Type);
      };
  } (PieceType);
}

ungetestet.

[edit]

Jetze.

PHP-Code:

  var PieceTypes = ['Q', 'R', 'B', 'N'];

for (Index in PieceTypes)  {
  var PieceType = PieceTypes[Index];
  var Image     = document.createElement('img');
  
  Image.onclick = function (Type) {
      return function () {
        alert (Type);
      };
  } (PieceType);
}

Chriz · 29.09.2010, 16:44

Das klappt? Ist mir komplett neu die Syntax.

nikosch · 29.09.2010, 16:53

Jetzt ja.

hts · 29.09.2010, 19:05

Zitat:

Zitat von nikosch

PHP-Code:

  var PieceTypes = ['Q', 'R', 'B', 'N'];

 
for (Index in PieceTypes)  {

  var PieceType = PieceTypes[Index];

  var Image     = document.createElement('img');

  

  Image.onclick = function (Type) {

      return function () {

        alert (Type);

      };

  } (PieceType);

}

Ja, funktioniert - nur verstehe ich garnicht, was da passiert

(PieceType); ist bei der verschachtelten Funktionen, der Parameter für die Innere. Nur gibt es hier keine Innere sondern den return einer Funktion?

Habe gerade nochmal etwas probiert.

PHP-Code:

    Image.onclick = function (PieceType) {

        alert (PieceType);

  }

Damit bekomme ich das Eventobjekt selbst.
Ich frage mich, wodurch in deinem Beispiel plötzlich der Parameter "Type" plötzlich belegt wird?

Das ist doch schwarze Magie

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
Auswahlwert in Variable speichern	sLaps	JavaScript, Ajax und mehr	3	20.09.2010 14:20
[Erledigt] inhalt einer while schleife in eine variable speichern	ePole	PHP Tipps 2010	20	17.07.2010 11:40
MySql Suchergebnis in eine Variable speichern	TheSymo	PHP Tipps 2010	3	21.05.2010 08:56
[Erledigt] Ergebnis in eine Variable speichern	sl0t	PHP Tipps 2010	7	10.02.2010 13:04
Wert aus Datenbank in Variable speichern	Extremefall	PHP Tipps 2009	11	15.12.2009 16:30
[Erledigt] Parameter aus URL speichern	dna	PHP Tipps 2009	13	18.03.2009 07:22
javascript funktion(ergebnis) in php variable speichern	martl666	PHP Tipps 2008	3	29.12.2008 17:13
Werte ein Variable speichern	aceras	PHP Tipps 2008	3	09.11.2008 12:09
[Erledigt] Variable Anzahl Parameter bie build-in-functions	sqrt	PHP Tipps 2008	16	25.05.2008 23:00
String aus einer Seite in Variable speichern	KimKaye	PHP Tipps 2008	10	14.05.2008 09:57
Variable als optionalen Parameter?	Mex	PHP Tipps 2006	3	20.04.2006 07:05
Auswahl als Variable ausgeben / in DB speichern		PHP Tipps 2006	3	14.01.2006 13:08
Feedback von URL-Aufruf in Variable speichern		PHP Tipps 2007	3	17.12.2005 18:50
text zwischen xx und xx in variable speichern?	md5hash	PHP Tipps 2005-2	3	13.09.2005 18:28
[Erledigt] Variable speichern		PHP Tipps 2005	9	24.02.2005 14:39

28.09.2010, 18:42
hts Erfahrener Benutzer Registriert seit: 07.09.2010 Beiträge: 722 PHP-Kenntnisse: Fortgeschritten	Closure + Parameter in Variable speichern Hi Leute, ich möchte einem Event einen Parameter mitgeben. Ich denke, dazu benutzt man in Javascript Closures. Hier mal meine ersten Gehversuche dazu (Code auf das Notwendigste gekürzt): Code: var PieceTypes = new Array('Q', 'R', 'B', 'N'); for(var I = 0; I < PieceTypes.length; I ++) { var PieceType = PieceTypes[i]; var Image = document.createElement('img'); Image.onclick = function() { var PromotionPieceType = PieceType; var Closure = function() { alert(PromotionPieceType); } Closure(); } } In der äußeren Eventfunktion speichere ich den Parameter in var PromotionPieceType = PieceType. Bei einem Klick auf ein Bild sollte jetzt der entsprechnde Wert ('Q', 'R', 'B' oder 'N') ausgegeben werden, aber es wird immer der letzte Wert "N" ausgegeben, egal auf welches Bild ich klicke. Also scheinbar wird dieser in der Schleife überschrieben Wie macht man es richtig?


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

28.09.2010, 21:50
rudygotya Erfahrener Benutzer Registriert seit: 28.05.2008 Beiträge: 2.094 PHP-Kenntnisse: Fortgeschritten	Benutz dafür bitte ein Framework. Memory leaks sind nicht sehr schön. Siehe z.b. jquery data __________________ ++++ Wieder einer ins Netz gegangen: Phishers Fritz zufrieden ++++ Blog

28.09.2010, 23:40
Chriz Moderator Registriert seit: 11.05.2008 Beiträge: 6.266	Hallo, also wenn du dich ein bisschen mit JS auskennst ist jQuery wunderbar intuitiv. Ich kanns wirklich nur empfehlen. Das Problem beim Selberschreiben ist eben, aber das weisst du sicherlich, dass es in deinem Browser einwandfrei funktioniert, im naechsten oder sogar in einer anderen Version wiederum nicht. Aber davon erfaehrst du moeglicherweise nie, weil die User deine Seite besuchen, es nicht funktioniert, und dann wieder verschwinden. __________________ "Nuschel ich?" - "Was?"

29.09.2010, 16:41
nikosch moderatives Dielektrikum Registriert seit: 21.05.2008 Beiträge: 35.987 PHP-Kenntnisse: Fortgeschritten	PHP-Code: `var PieceTypes = ['Q', 'R', 'B', 'N']; for (PieceType in PieceTypes) { var Image = document.createElement('img'); Image.onclick = function (Type) { return function () { alert (Type); }; } (PieceType); }` ungetestet. [edit] Jetze. PHP-Code: `var PieceTypes = ['Q', 'R', 'B', 'N']; for (Index in PieceTypes) { var PieceType = PieceTypes[Index]; var Image = document.createElement('img'); Image.onclick = function (Type) { return function () { alert (Type); }; } (PieceType); }` __________________ -- One pixel is still too big. Please make it smaller. ASAP. Initiative Mittelstand. Die wichtigste Gestaltungsregel im Screendesign ist Pi mal Daumen des Arbeitgebers. -- Geändert von nikosch (29.09.2010 um 16:52 Uhr).

29.09.2010, 16:44
Chriz Moderator Registriert seit: 11.05.2008 Beiträge: 6.266	Das klappt? Ist mir komplett neu die Syntax. __________________ "Nuschel ich?" - "Was?"

29.09.2010, 16:53
nikosch moderatives Dielektrikum Registriert seit: 21.05.2008 Beiträge: 35.987 PHP-Kenntnisse: Fortgeschritten	Jetzt ja. __________________ -- One pixel is still too big. Please make it smaller. ASAP. Initiative Mittelstand. Die wichtigste Gestaltungsregel im Screendesign ist Pi mal Daumen des Arbeitgebers. --