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
js zum Schreiben des Karusselleffekts
In diesem Artikel wird der spezifische Code von j...
Tipps zum Listenaufbau für Website-Wartungsseiten
Und oft ist es für Wartungsarbeiten erforderlich, ...
In der HTML-Tabelle wird nur der äußere Rand der Tabelle angezeigt
Ich möchte eine Frage stellen. Ich habe in Dreamw...
CSS zum Erzielen einer Schließen-Schaltfläche zum Vergrößern und Verkleinern (Beispielcode)
Dieser Effekt tritt am häufigsten auf unserer Bro...
Detaillierte Erklärung der Docker-Maschinennutzung
Docker-Machine ist ein offiziell von Docker berei...
Detaillierte Methode zur Verwendung von GoAccess zum Analysieren von Nginx-Protokollen
Vor kurzem wollte ich Goaccess verwenden, um Ngin...
Installations-Tutorial zur komprimierten Version von MySQL 8.0.11 unter Win10
In diesem Artikel finden Sie das Installations-Tu...
Beispiel für die MySQL-Triggeroperation „Hinzufügen“, „Löschen“, „Ändern“ und „Abfragen“
In diesem Artikel werden anhand von Beispielen di...
Grundlegende Kenntnisse zur Verwendung von Miniprogrammen (sehr umfangreich, empfehlenswert!)
Inhaltsverzeichnis Was ist bei der Registrierung ...
Führen Sie die Schritte zur Installation von FFmpeg auf dem CentOS-Server aus
Vorwort Die Serversystemumgebung ist: CentOS 6.5 ...
Implementierung einer benutzerdefinierten Vue-Vorlage von vscode
Verwenden Sie den Vscode-Editor, um eine Vue-Vorl...
CSS-Tipps zur Steuerung der Wiedergabe und Pause von Animationen (sehr praktisch)
Heute stelle ich einen sehr einfachen Trick vor, ...
Detaillierte Erläuterung des Watch-Listener-Beispiels in vue3.0
Inhaltsverzeichnis Vorwort Der Unterschied zwisch...
So ändern Sie MySQL, um Remoteverbindungen zuzulassen
In Bezug auf die MySQL-Remoteverbindung stoßen wi...
Eine kurze Analyse der Verwendung der Zero-Copy-Technologie in Linux
In diesem Artikel werden mehrere wichtige Zero-Co...