Real time Rechner (AJAX/JS) bearbeitet von Gunnar Bittersmann 12.06.2019 08:07 @@MaxiG > ~~~html > <html> > ~~~ Hier fehlt die Angabe der Sprache: `<html lang="de">`{:.language-html}. Im `head` sollten noch die Angabe der verwendeten Zeichencodierung und die Viewportangabe stehen. ☞ [Grundgerüst](https://wiki.selfhtml.org/wiki/HTML/Tutorials/HTML5/Grundger%C3%BCst) > ~~~html > <script type="text/javascript"> > <!-- > ~~~ `type="text/javascript"` kannst du weglassen. `<!--`{:.language-html} solltest du weglassen! (Zumal bei dir auch das Ende des Kommentars fehlt.) > ~~~js > var wert1 = document.getElementById('feld1').value; > var wert2 = document.getElementById('feld2').value; > var erg1 = wert1 * wert2; > ~~~ Was haben deine Debug-Versuche ergeben? Du hast keine unternommen? Lass dir mal die Werte ausgeben, z.B. mit `console.log(wert1, wert2)`{:.language-js}. Wenn du dann noch nicht siehst, was da los ist, deren Typen: `console.log(typeof wert1, typeof wert2)`{:.language-js}. Was kommt also als `erg1`{:.language-js} raus? > ~~~html > <input type='text' id='feld1' onKeyUp='calculate()'> x <input type='text' id='feld2' onKeyUp='calculate()' value='2'> = <span id='erg1'></span> > ~~~ Die Eingabefelder sollten vom Typ `"number"` sein. (Dann kannst du auch Minimal- und Maximalwerte dafür angeben.) Die Eingabefelder müssen eine [Beschriftung (`label`)](https://wiki.selfhtml.org/wiki/HTML/Formulare/label) haben! Ansonsten wissen bspw. blinde Nutzer nicht, was sie eingeben müssen. Ein einigen Spezialfällen (wovon das einer sein könnte) kann man das Label [visuell verstecken](https://a11yproject.com/posts/how-to-hide-content/). Das Ausgabefeld wäre gern ein `output`-Element (kein `span`) – auch mit Label. Und das Malzeichen sieht so aus: × (nicht ein x für ein × vormachen). LLAP 🖖 PS: Mit AJAX hat das alles nichts zu tun. -- *„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“* —Kurt Weidemann
Real time Rechner (AJAX/JS) bearbeitet von Gunnar Bittersmann 12.06.2019 08:08 @@MaxiG > ~~~html > <html> > ~~~ Hier fehlt die Angabe der Sprache: `<html lang="de">`{:.language-html}. Im `head` sollten noch die Angabe der verwendeten Zeichencodierung und die Viewportangabe stehen. ☞ [Grundgerüst](https://wiki.selfhtml.org/wiki/HTML/Tutorials/HTML5/Grundger%C3%BCst) > ~~~html > <script type="text/javascript"> > <!-- > ~~~ `type="text/javascript"` kannst du weglassen. `<!--`{:.language-html} solltest du weglassen! (Zumal bei dir auch das Ende des Kommentars fehlt.) > ~~~js > var wert1 = document.getElementById('feld1').value; > var wert2 = document.getElementById('feld2').value; > var erg1 = wert1 * wert2; > ~~~ Was haben deine Debug-Versuche ergeben? Du hast keine unternommen? Lass dir mal die Werte ausgeben, z.B. mit `console.log(wert1, wert2)`{:.language-js}. Wenn du dann noch nicht siehst, was da los ist, deren Typen: `console.log(typeof wert1, typeof wert2)`{:.language-js}. Was kommt also als `erg1`{:.language-js} raus? > ~~~html > <input type='text' id='feld1' onKeyUp='calculate()'> x <input type='text' id='feld2' onKeyUp='calculate()' value='2'> = <span id='erg1'></span> > ~~~ Die Eingabefelder sollten vom Typ `"number"` sein. (Dann kannst du auch Minimal- und Maximalwerte dafür angeben.) Die Eingabefelder müssen eine [Beschriftung (`label`)](https://wiki.selfhtml.org/wiki/HTML/Formulare/label) haben! Ansonsten wissen bspw. blinde Nutzer nicht, was sie eingeben müssen. Ein einigen Spezialfällen (wovon das einer sein könnte) kann man das Label [visuell verstecken](https://a11yproject.com/posts/how-to-hide-content/). Das Ausgabefeld wäre gern ein `output`-Element (auch mit Label). Und das Malzeichen sieht so aus: × (nicht ein x für ein × vormachen). LLAP 🖖 PS: Mit AJAX hat das alles nichts zu tun. -- *„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“* —Kurt Weidemann
nicht angemeldet nicht angemeldet
