HTML und CSS Rechner - Input?
Wie bekomme ich es hin, dass , wenn ich eine Taste drücke diese Zahl dann in das Input Feld gelangt?
Danke im voraus!
5 Antworten
Das kannst du mithilfe von JavaScript umsetzen. Dazu legst du für jeden Button einen onclick-Listener an, in welchem du das value des input-Feldes anpasst.
Beachte https://www.w3schools.com/tags/tag_script.asp und https://www.w3schools.com/tags/att_script_src.asp. Aber wie im Link in der Antwort zu sehen ist, kannst du auch das onclick-Attribut verwenden.
Sorry, dass ich so viel frage, aber könnten sie mir eventuell an meinem Script erklären, wie ich das mache :/
War schon dabei :) Hier ein kleines Beispiel: jsfiddle.net/hpusa0vc
Vielen Dank!!! Es hat mir sehr weitergeholfen :) Sie bekommen den Stern!
Der Fokus muss auf dem Feld liegen, sprich der Cursor dort blinken. Das ist nichts was Du per HTML oder CSS steuern kannst - nur per JavaScript.
Das erinnert mich an ein mobiles Nav Menu das ich mal ohne java script machen musste.
Der Hack war, input type="checkbox" zu benutzen und mit CSS den Wert checkbox:checked zu positionieren.
Aber fuer einen Taschenrechner waere das den Aufwand echt nicht wert, nimm js!!!
Mir ist der Aufwand egal, hauptsache es funktioniert am ende :D
Ich habe es noch nicht ganz verstanden :D Könnten sie es mir eventuell noch einmal anhand meines Scripts erklären ?
Ich kenne mich nicht sehr gut damit aus aber ich glaube du brauchst dafür noch javascript.
Dafür reichen meine Kenntnisse nicht aus! :D Tut mir leid.
Alles gut, habe es jetzt eh herausgefunden. Mein Zwischenergebnis: https://ag3smnp7pkmuofjrxd7uma-on.drv.tw/Webseite/WWWExp.html
Warum das Rad neu erfinden, wenn es das schon tausend mal im Netz gibt??
Einfach so was wie meinen folgenden Rechner nehmen und anpassen.
SELFHTML ist auch immer eine gute Anlaufstelle.
<html>
<head>
<title>Taschenrechner </title>
</head>
<body bgcolor= "# 000000" text= "yellow">
<form name="calculator" ><input type="button" value="1" onClick="document.calculator.ans.value+='1'"><input type="button" value="2" onClick="document.calculator.ans.value+='2'"><input type="button" value="3" onClick="document.calculator.ans.value+='3'"><input type="button" value="+" onClick="document.calculator.ans.value+='+'"> <br>
<input type="button" value="4" onClick="document.calculator.ans.value+='4'"><input type="button" value="5" onClick="document.calculator.ans.value+='5'"><input type="button" value="6" onClick="document.calculator.ans.value+='6'"><input type="button" value="-" onClick="document.calculator.ans.value+='-'"> <br>
<input type="button" value="7" onClick="document.calculator.ans.value+='7'"><input type="button" value="8" onClick="document.calculator.ans.value+='8'"><input type="button" value="9" onClick="document.calculator.ans.value+='9'"><input type="button" value="*" onClick="document.calculator.ans.value+='*'"> <br>
<input type="button" value="/" onClick="document.calculator.ans.value+='/'"><input type="button" value="0" onClick="document.calculator.ans.value+='0'"><input type="reset" value="C"><input type="button" value="=" onClick="document.calculator.ans.value=eval(document.calculator.ans.value)"><br><br>Ergebnis = <input type="textfield" name="ans" value="">
</form>
</body>
</html>
Die Attribute bgcolor und text sind schon seit etlichen Jahren nicht mehr Teil des Standards, also falsch. Der Doctype fehlt und statt textfield wäre der Typ text für das Ergebnisfeld richtig (Ersteren gibt es nämlich gar nicht).
Zu guter Letzt halte ich dein Vorgehen für keine gute Lösung. Den Code könnte man gut vom Markup trennen und damit auch Redundanzen beseitigen.
Also wie gesagt, selbst wenn man davon absieht, ist dein Markup da oben fehlerhaft. Es wäre dann wohl an der Zeit, dass du deinen Kenntnisstand nochmal auffrischt. 😉
Das sollte basiert auf dem sorglosen Vertrauen darauf, dass es die Browser mit ihren verschiedenen Modi doch noch richten. Das ist aber keinesfalls eine gute und sichere Basis für Webseiten.
Muss ich Dir recht geben, aber da habe ich im Augenblick keinen Zeit für (musste mich entscheiden - echtes Geschäft oder Internetseiten, Internet hat verloren).
Wenn ich (in ein paar Jahren) Rentner bin, werde ich evtl. meine Kenntnisse wieder auf Vordermann bringen - solange habe ich (pünktlich zum Inkrafttreten der DSGVO) die Inhalte meiner Domains aus dem Netz genommen.
Allerdings werde ich dann sicher nicht mehr wie früher mit nacktem HTML arbeiten, sondern das ganze einer Software (evtl. Wordpress) überlassen.
Vielen Dank! Werde ich jetzt ausprobieren. Wie kann ich Javascript "Verlinken", also damit Google bzw das Programm erkennt dass diese Javadatei zu der und der Datei gehört