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

[ERLEDIGT] window.onload als button

Anne Kochhan

Neues Mitglied
Hallo Leute ;)
Ich habe folgendes Problem ich möchte auf meine Webseite 2 Knöpfe mit 2 verschidenen funktionen einbauen. Jedoch funktioniert der erste Knopf nicht mehr sobald ich den zweiten hinzufüge. Hier ein Beispiel:

Code:
<!DOCTYPE html>
<html>
    <head>
        <title>Button Test</title>
        <style>
            label, button {
                display: block;
                margin: 2em;
            }
            input {
                width: 3.5em;
            }
        </style>
        <script>
            function berechne_Summe () {
                var zahl1 = parseInt(document.getElementById("zahl1").value);
                var zahl2 = parseInt(document.getElementById("zahl2").value);
 
                var summe = zahl1 + zahl2;
 
                document.getElementById("summe").value = summe;
            }
 
            window.onload = function () {
                document.getElementById("berechnen").onclick = berechne_Summe;
            };
            
            
            function berechne_Produkt () {
                var zahl1 = parseInt(document.getElementById("zahl1").value);
                var zahl2 = parseInt(document.getElementById("zahl2").value);
 
                var produkt = zahl1 * zahl2;
 
                document.getElementById("produkt").value = produkt;
            }
 
            window.onload = function () {
                document.getElementById("berechnen_produkt").onclick = berechne_Produkt;
            };
            
            
            
        </script>
    </head>
    <body>
        <h1>Web-Rechnen</h1>
                <main>
        <form>
            <label for="zahl1">Zahl1:
                <input id="zahl1" type="number"  value="100">
            </label>
            <label for="zahl2">Zahl2:
                <input id="zahl2" type="number"  value="75">
            </label>
            <label>Summe:
                <output id="summe"></output>
                </br>
                Produk:
                <output id="produkt"></output>
            </label>
            <button type="button" id="berechnen">Summe berechnen</button>
            <button type="button" id="berechnen_produkt">Produk berechnen</button>
        </form>
                </main>
    </body>
</html>

Danke schonmal im vorraus xD
 
Werbung:
Die beiden window.onload-Funktionen am Ende zusammenführen:
Javascript:
function berechne_Summe () {
    ...
}

function berechne_Produkt () {
    ...
}

window.onload = function () {
    document.getElementById("berechnen").onclick = berechne_Summe;
    document.getElementById("berechnen_produkt").onclick = berechne_Produkt;
};
Fiddle-Demo: https://jsfiddle.net/SpiceLab/t767ov0e/
 
Werbung:
Zurück
Oben