Techblog

Ziel: Bei einem Eingabefeld (z.B. Zahlen) soll unmittelbar mit einer Ausgabe in einem zweiten Feld reagiert werden.

HTML:

<input type="text" id="zahl1" oninput="func1()" pattern="[0-9].+">
<input type="text" id="zahl2" oninput="func2()" pattern="[0-9].+">

Javascript:

function func1() {
    var x = document.getElementById("zahl1").value;
    let y = x*1.16;
    document.getElementById("zahl2").value = y.toFixed(2);
}
function func2() {
    var x = document.getElementById("zahl2").value;
    let y = x/1.16;
    document.getElementById("zahl1").value = y.toFixed(2);
}

Über die Zusätze placeholder=“eins” und style=“width:100px” kann das Aussehen des Eingabefeldes verändert werden.