In diesem Artikel finden Sie den spezifischen Code zum Erstellen eines einfachen Taschenrechners mit js als Referenz. Der spezifische Inhalt ist wie folgt Um einen einfachen Rechner wie in der Abbildung zu erstellen, müssen Sie zunächst ein Formular erstellen und es wie in der Abbildung aussehen lassen. <Tabellenrand="1" Zellenabstand="0" > <tr><th colspan="2">Einkaufsrechner</th></tr> <tr> <td>Die erste Zahl</td> <td><Eingabetyp="text" id="inputId1" /></td> </tr> <tr> <td>Die zweite Zahl</td> <td><Eingabetyp="text" id="inputId2" /></td> </tr> <tr> <td><button type="button" onclick="cal('+')" >+</button></td> <td><button Typ="button" beim Klicken="cal('-')" >-</button> <Schaltfläche Typ="Schaltfläche" beim Klicken="cal('*')" >*</Schaltfläche> <button type="button" onclick="cal('/')" >/</button></td> </tr> <tr> <td>Berechnungsergebnisse</td> <td><input Typ="Text" id="Ergebnis-ID"/></td> </tr> </Tabelle> Onclick verwendet die Methode cal(). Tatsächlich habe ich zunächst die Methoden add, sub, mul und div verwendet. Später stellte ich fest, dass diese vier Methoden bis auf die Rechenoperatoren gleich sind. Daher habe ich mich für eine Methode entschieden. Beim Klicken auf die Schaltfläche ist der an die Methode übergebene Rechenoperator anders. Der Code lautet wie folgt: <Skripttyp="text/javascript"> Funktion cal(Typ){ var num1 = document.getElementById('inputId1'); var num2 = document.getElementById('inputId2'); var Ergebnis; Schalter(Typ){ Fall '+': Ergebnis = parseInt(num1.value) + parseInt(num2.value); brechen; Fall '-': Ergebnis = parseInt(num1.value) – parseInt(num2.value); brechen; Fall '*': Ergebnis = parseInt(num1.value) * parseInt(num2.value); brechen; Fall '/': Ergebnis = parseInt(num1.value) / parseInt(num2.value); brechen; } var resultObj = document.getElementById('resultId'); resultObj.value = Ergebnis; } </Skript> Das Obige ist der vollständige Inhalt dieses Artikels. Ich hoffe, er wird für jedermanns Studium hilfreich sein. Ich hoffe auch, dass jeder 123WORDPRESS.COM unterstützen wird. Das könnte Sie auch interessieren:
|
<<: Zusammenfassung der MySQL-Sperrwissenspunkte
>>: Analyse der zum Ausführen von Docker erforderlichen Berechtigungen
Hier ist eine Fallstudie zu Ihrer Information, wi...
Der Parameter innodb_autoinc_lock_mode steuert da...
Wenn Sie den Eindruck haben, dass ein Problem mit...
Vorab geschrieben: In den folgenden Schritten müs...
Crontab installieren yum install crontabs CentOS ...
Vorwort Dieser Artikel stellt hauptsächlich den r...
Inhaltsverzeichnis UI-Design Echarts Beispieleffe...
Heute werde ich Ihnen einen Laufschrifteffekt zei...
Vorwort Ich glaube, jeder ist mit dem Hinzufügen ...
Inhaltsverzeichnis 1. Quellcode 1.1 Monorepo 1.2 ...
Ich bin einmal auf eine Aufgabe gestoßen, bei der...
In diesem Artikel wird hauptsächlich der Beispiel...
In diesem Artikel werden hauptsächlich die Stilat...
Inhaltsverzeichnis Vorwort Schritt Vorwort Heute ...
Inhaltsverzeichnis Merkmale Vorteile Installation...