[Erledigt] Zugriff auf Unterelemente eine Event Objects

[Moonblood]

Hi Leute,

ich bin gerade dabei mir die Thematik Events und Event Handling anzuschauen.
So weit komme ich auch klar damit, jedoch habe ich noch ein Problem.
Wenn ein Event Objekt mehrere Unterelement z.B. in Form von inputs hat, wie ich auf diese zugreifen kann.

Nach meinem Verständniss werden diese Unterobjekt in Form eines Arrays im Event Objekt ansprechbar. Jedoch funktioniert meine Herangehensweise nicht.

Am Beispiel eines Formulars..

<form id="login">
	<input name="user" type="text" value="Username"/>
	<input name="password" type="password" value="Password"/>
	<input type="submit" value="login" />
	<input type="reset" value="löschen">
</form>

JS Code...

function checkFormData(evt){
		
	// Ziel Object
	var form_data = evt.target || window.event.srcElement;
		
	for (var i = 0; i <= form_data.length; i++){
			
		console.log("Input Name => "+ form_data.input[i].defaultValue+ " </br>") ;
			
			
	}
				

	//console.log(form_data.input[0].defaultValue);
	
	return false;
}

Im Beispiel möchte ich die Values der Inputs ausgeben, mein Ansatz funktioniert leider nicht.. Kann mir jemand einen Tipp geben, was ich falsch mache?

Fehlermeldung.
TypeError: form_data.input is undefined

[Gast]

mach halt mal ein console.debug(evt) um zu sehen was da drin ist.
ich denke das ist/war auch lesenwert:
http://www.quirksmode.org/js/events_order.html

[rudygotya]

Du musst nicht den Umweg über den Event gehen:
https://developer.mozilla.org/en-US/..._event_handler

DOMElement.childNodes:
http://eloquentjavascript.net/13_dom.html#standard

Wenn du schnell vorwärts kommen willst, schnapp dir ein DOM-Framework wie jQuery, zepto, dojo oder mootools. Wenn nicht, hier noch mehr Lesestoff: http://code.tutsplus.com/tutorials/f...nce--net-23703

Grüße

Basti

[Moonblood]

@mamo wenn ich console.debug(evt) eingebe, passiert garnichts. Also es wird nichts zusätzlich in der Console ausgegeben?

Wenn ich jedoch, console.log(evt.target) ausgebe, dann bekomme ich mein Forumlar-Element welches besagte vier Input enthält.

Deinen Lesetipp werde ich mir Morgen gründlich anschauen, wobei ich beim überfliegen festgestellt habe das dies hier --> http://molily.de/js/event-handling-objekt.html auch gut erklärt wurde.

[rudygotya]

Kann sein - die Links von mir würde ich dir dennoch ans Herz legen wollen JS macht nur Spaß, wenn man den Kontextwechsel (1. Link) von `this` verinnerlicht hat.

[Moonblood]

@rudygotya thx für den Tipp.

Ich hab die Sache jetzt lösen können.

	function checkFormData(evt){
		
		// Ziel Object
		var form_data = evt.target || window.event.srcElement;
		
		// die Input Elemente
		var input_elements = evt.target.children;
		
		for (var i = 0; i < input_elements.length; i++){
			
			var input = input_elements[i];
			
			console.log(input);
			
		}
		return false;
	}

Jetzt habe ich Zugriff auf alle Input Elemente..

Ich werde mir dennoch mal Lese Tipps anschauen, habt Dank für eure Hinweise..

@rudygotya auf jeden Fall, JS macht nur Spaß wenn man es richtig verstanden hat. Und dahin möchte ich auch ganz gern, dank eurer hilfreichen Tipps in Form von Lernstoff werde ich das auch früher oder später schaffen..

Vielen Dank euch noch mal...