Verwenden von JS zum Implementieren eines einfachen Rechners
|
Verwenden Sie JS, um einen einfachen Rechner für Ihre Referenz zu vervollständigen. Die spezifischen Inhalte sind wie folgt Voraussetzungen: Der Eingabewert kann nur eine Zahl sein, verwenden Sie einen regulären Ausdruck
<!DOCTYPE html>
<html lang="de">
<Kopf>
<meta charset="UTF-8">
<meta name="viewport" content="width=Gerätebreite, Anfangsmaßstab=1.0">
<meta http-equiv="X-UA-kompatibel" content="ie=edge">
<title>Rechner</title>
</Kopf>
<Text>
<div Stil="Textausrichtung: Mitte;">
<Eingabetyp="text" id="1" onkeyup="this.value=this.value.replace(/[^\d]/g,'') " >
<Name auswählen="Auswählen" ID="Auswählen">
<option value="null">Bitte wählen</option>
<optionswert="0">+</option>
<option value="1">-</option>
<optionswert="2">*</option>
<optionswert="3">/</option>
</Auswählen>
<Eingabetyp="text" id="2" onkeyup="dieser.Wert=dieser.Wert.replace(/[^\d]/g,'') ">
=
<Eingabetyp="Text" id="3" onkeyup="dieser.Wert=dieser.Wert.Ersetzen(/[^\d]/g,'') "><br><br>
</div>
<div Stil="Textausrichtung: Mitte;">
<input type="button" id="button"value="berechnen">
</div>
<Skript>
Funktion accAdd(arg1,arg2){
var r1,r2,m;
versuchen{
r1=arg1.toString().split(".")[1].Länge
}fangen(e){
r1 = 0
}
versuchen{
r2=arg2.toString().split(".")[1].Länge
}fangen(e){
r2 = 0
}
m=Math.pow(10,Math.max(r1,r2))
Rückgabewert (Argument1*m+Argument2*m)/m
}
Nummer.prototyp.add = Funktion (Argument) {
gibt accAdd(arg,dies) zurück;
}
Funktion Subtr(arg1,arg2){
var r1, r2, m, n;
versuchen{
r1=arg1.toString().split(".")[1].Länge
}fangen(e){
r1 = 0
}
versuchen{
r2=arg2.toString().split(".")[1].Länge
}fangen(e){
r2 = 0
}
m=Math.pow(10,Math.max(r1,r2));
// zuletzt geändert von deeka
// Die Genauigkeitslänge dynamisch steuern n=(r1>=r2)?r1:r2;
Rückgabewert ((arg1*m-arg2*m)/m).toFixed(n);
}
Funktion accMul(arg1,arg2) //Multiplikation {
var m=0,s1=arg1.toString(),s2=arg2.toString();
versuchen{
m+=s1.split(".")[1].Länge
}fang(e){}
versuchen{
m+=s2.split(".")[1].Länge
}fang(e){}
returniere Zahl(s1.replace(".",""))*Zahl(s2.replace(".","")) / Math.pow(10,m)
}
//Fügen Sie dem Number-Typ eine Mul-Methode hinzu, um den Aufruf zu vereinfachen.
Nummer.prototype.mul = Funktion (Argument) {
gibt accMul zurück (arg, dies);
}
Funktion accDiv(arg1,arg2){
var t1=0,t2=0,r1,r2;
versuchen{
t1=arg1.toString().split(".")[1].Länge
}fang(e){}
versuchen{
t2=arg2.toString().split(".")[1].Länge
}fang(e){}
mit(Mathe){
r1=Zahl(arg1.toString().replace(".",""))
r2=Zahl(arg2.toString().replace(".",""))
Rückgabewert (r1/r2)*pow(10,t2-t1);
}
}
Nummer.prototyp.div = Funktion (Argument) {
gibt accDiv(dieses, arg) zurück;
}
document.getElementById('Schaltfläche').onclick=Funktion(){
var num1 = document.getElementById('1').value;
var num2 = document.getElementById('2').value;
Variable Nummer3;
var op = document.getElementById('Auswahl').Wert;
Schalter(op){
Fall '0':
Zahl3 = accAdd(Zahl1,Zahl2);
brechen;
Fall '1':
Zahl3 = Subtr(Zahl1,Zahl2);
brechen;
Fall '2':
Anzahl3=accMul(Anzahl1,Anzahl2);
brechen;
Fall '3':
Zahl3=accDiv(Zahl1,Zahl2);
brechen;
}
document.getElementById('3').value=num3;
}
</Skript>
</body>
</html>Effektbild:
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 allgemeinen MySQL-SQL-Anweisungen einschließlich komplexer SQL-Abfragen
>>: Zabbix überwacht den Prozess der Linux-Systemdienste
Artikel empfehlen
Der Unterschied zwischen der Übermittlungsaktion eines HTML-Formulars und dem Sprung zur URL
Die Aktion des Formulars unterscheidet sich vom UR...
Lösen Sie das Problem verstümmelter chinesischer Zeichen, wenn Sie Daten von Tomcat unter Linux in MySQL einfügen
1. Problem Das mit Eclipse unter Windows entwicke...
Lösung für die horizontale Bildlaufleiste im Iframe unter IE6
Die Situation ist wie folgt: (PS: Das rote Kästche...
Warum Google und Facebook Docker nicht verwenden
Der Grund für das Schreiben dieses Artikels beste...
Implementierung von HTTP- und HTTPS-Diensten mit Nginx-Reverse-Proxy für mehrere Domänennamen
Derzeit verfügt Nginx über einen Reverse-Proxy fü...
Über nginx zur Implementierung des Jira-Reverse-Proxys
Zusammenfassung: Nginx-Reverse-Proxy für JIRA kon...
Detaillierte Erklärung zum Aktivieren des langsamen Abfrageprotokolls in der MySQL-Datenbank
Die Datenbank ermöglicht langsame Abfrageprotokol...
So extrahieren Sie Zeichenfolgenelemente aus nicht festen Positionen in MySQL
Vorwort Hinweis: Die Testdatenbankversion ist MyS...
Acht Beispiele, wie Vue Komponentenkommunikation implementiert
Inhaltsverzeichnis 1. Props übergeordnete Kompone...
Aktivierungsmethode für Windows Service 2016 Datacenter\Stand\Embedded (2021)
Führen Sie cmd mit Administratorrechten aus slmgr...
Der Einsatz von MySQL Triggern und worauf zu achten ist
Inhaltsverzeichnis Über Trigger Verwendung von Tr...
VMware-Installationsfehler: VMware Workstation konnte VMware Authorization Service nicht starten
Hintergrund: Ich möchte einen SAP ECC Server inst...
Web 2.0: Ursachen und Lösungen der Informationsüberflutung
<br />Informationsduplikation, Informationsü...
JavaScript implementiert drei gängige Webeffekte (Offset, Client, Scroll-Serie).
Inhaltsverzeichnis 1. Elementversatzserie 2. Elem...
jQuery-Plugin für ein nahtloses Karussell
Ein nahtloses Karussell ist ein sehr häufiger Eff...