AddEventListener klappt nicht

[Bennux]

Hallo,

ich beschäftigte mich gestern Abend das erste Mal mit JavaScript und habe ein wenig rumprobiert. Unter anderem meine obligatorische Addition. Wenn ich die Function "Addition" einfach im HTML-Teil beim Button mit "onclick="Function(Para1, Para2)" aufrufe, klappt alles. Eleganter soll es aber sein mittels addEventListener. Hier habe ich aber ein Problem, es tut sich beim Buttom-Klick einfach gar nichts.

Wo mache ich den Fehler?

<script type="text/javascript">

	var obj = document.getElementById('Add');
	obj.addEventListener('click', AdditionFunction(Addition.Zahl1.value, Addition.Zahl2.value), true);
	

    function AdditionFunction(zahl1, zahl2) {
	
	var erg = parseInt(zahl1) + parseInt(zahl2);
	Addition.Ergebnis.value = erg;
    }


</script>

<form name="Addition" id="Add">
	<input type="text" name="Zahl1">
	<input type="text" name="Zahl2">
	<input type="button" value="Addieren" name="Rechnung">
	<input type="text" name="Ergebnis">
</form>

 

[rico2009]

Du setzt das Event auf dem Form-Tag, nicht auf dem Button...

Schreibt mal folgende Zeile um und gibt dem Button die Id "button", dann sollte das funktionieren:

var obj = document.getElementById('Add');

// in

var obj = document.getElementById('button');

 

[kkapsner]

Du hast etwas in der Fehlerkonsole... du musst das <script> etweder hinter das <form> packen oder den Code erst im window.onload oder DOM-Ready Event ausführen.

Zusätzlich hast du an addEventListener keine Funktionsreferenz, sondern den Rückgabewert der Funktion AdditionFunction übergeben... also undefined.

<form name="Addition" id="Add">
	<input type="text" name="Zahl1">
	<input type="text" name="Zahl2">
	<input type="button" value="Addieren" name="Rechnung">
	<input type="text" name="Ergebnis">
</form>
<script type="text/javascript">

	var obj = document.getElementById('Add');
	obj.Rechnung.addEventListener('click', function(){
		AdditionFunction(this.form.Zahl1.value, this.form.Zahl2.value, this.form.Ergebnis);
	}, true);
	

    function AdditionFunction(zahl1, zahl2, outputNode) {
	
	var erg = parseFloat(zahl1) + parseFloat(zahl2);
	outputNode.value = erg;
    }


</script>