• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Rechner erstellen. mehrere submit-buttons(HTML,javascript)

Freak148

Neues Mitglied
Sehr geehrtes Forum,

ich bin gerade dabei einen Rechner mit html und javascript zu erstellen. Der sieht bis jetzt so aus:

<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8"/>
<meta name="description" content=""/>
<meta name="author" content="TD"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="stylesheet" type="text/css" href="../style/style.css"/>
<script type="text/javascript" src="jquery-2.0.1.min.js">
</script>
<script type="text/javascript" src="rechner.js">
</script>
<title>Rechner</title>
</head>
<body>
<div class="Main">
<form accept-charset="UTF-8"
action='javascript:addieren(document.getElementsByName("xfeld")[0].value,
document.getElementsByName("yfeld")[0].value);'


action='javascript:subtrahieren(document.getElementsByName("xfeld")[0].value,
document.getElementsByName("yfeld")[0].value);'


action ='javascript:multiplizieren(document.getElementsByName("xfeld")[0].value,
document.getElementsByName("yfeld")[0].value);'


action ='javascript:dividieren(document.getElementsByName("xfeld")[0].value,
document.getElementsByName("yfeld")[0].value);'>
<table border=10 cellpadding=10>
<tr>
<td> <input name='xfeld'> </td>
<td> <input name='yfeld'> </td>
<div id='Ergebnis'></div>
<td> <input type=submit name='addieren' value='addieren'> </td>
<td> <input type=submit name='subtrahieren' value='subtrahieren'> </td>
<td> <input type=submit name='multiplizieren' value='multiplizieren'> </td>
<td> <input type=submit name='dividieren' value='dividieren'> </td>
</tr>
<output id='Ergebnis'></output>
</div>
</form>


</body>
</html>


Nun habe ich das Problem, dass ich zwar unterschiedliche Namen für meine Submit-buttons habe, jedoch nicht in der Lage bin sie zu differenzieren. Ich habe mir überlegt, dass ich das mit If mache, jedoch geht das bei HTML ja nicht. Mein zweiter Ansatz war, dass ich versuchte meine Form zum javascript Dokument zu übertragen.
Mein javascript dokument sieht übrigens so aus:
function addieren(x, y) {
summe = parseInt(x) + parseInt(y);
document.getElementById('Ergebnis').innerHTML= summe;
}




function subtrahieren(x, y) {
var differenz = parseInt(x) - parseInt(y);
document.getElementsByName('Ergebnis')[0].value.innerHTML= differenz;
}


function multiplizieren(x, y) {
var Produkt = parseInt(x) * parseInt(y);
document.getElementsByName('Ergebnis')[0].value.innerHTML= Produkt;
}




function dividieren(x, y) {
var Quotient = parseInt(x) / parseInt(y);
document.getElementsByName('Ergebnis')[0].value.innerHTML= Quotient;
}


Ich freue mich auf eure Antworten :)

freundliche Grüße
 
Selbst wenn ich ihnen ids geben sollte(was ich bereits einmal verscuht habe) bin ich doch noch nicht in der lage die Buttons so zu unterscheiden, dass die oben beschirebenen funktionen aufgeruft werden oder nicht?
 
Das hier ist falsch, das kann man so nicht machen:

HTML:
<form accept-charset="UTF-8"
action='javascript:addieren(document.getElementsBy Name("xfeld")[0].value,
document.getElementsByName("yfeld")[0].value);'


action='javascript:subtrahieren(document.getElemen tsByName("xfeld")[0].value,
document.getElementsByName("yfeld")[0].value);'


action ='javascript:multiplizieren(document.getElementsBy Name("xfeld")[0].value,
document.getElementsByName("yfeld")[0].value);'


action ='javascript:dividieren(document.getElementsByName ("xfeld")[0].value,
document.getElementsByName("yfeld")[0].value);'>

Ich würde dir empfehlen als form-Element einzig

HTML:
<form action="#" onsubmit="return false;">

zu schreiben und die JavaScript-Funktionen jeweils direkt an die Buttons zu binden. Also z.B.:

HTML:
<input type="submit" name="dividieren" value="dividieren" onclick="dividieren(document.getElementsByName ("xfeld")[0].value,
document.getElementsByName("yfeld")[0].value);">
 
Zurück
Oben