Javascript-forum
Variable in Input <type='text'> ausgeben - Druckversion

+- Javascript-forum (https://javascript-forum.de)
+-- Forum: Entwicklung (https://javascript-forum.de/forumdisplay.php?fid=4)
+--- Forum: Javascript (https://javascript-forum.de/forumdisplay.php?fid=6)
+--- Thema: Variable in Input <type='text'> ausgeben (/showthread.php?tid=345)



Variable in Input <type='text'> ausgeben - Faultier_1982 - 16.01.2022

Hallo,
Ich versuche in meinen Anfängen in JavaScript eine let-Variable in einem input type='text' zu übertragen. Im Internet ich habe bereits Beispielcode gefunden, leider habe ich diese nicht zum laufen gebracht... In die Überschrift habe ich meine Variable geschrieben bekommen...
Code:
<!DOCTYPE html> <!-- For more information visit: https://fipsok.de -->
<html lang="de">
   <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <link rel="stylesheet" href="Vorlage_fur_style.css">
      <title>Titel Registerfenster</title>
      <script type="text/javascript">
         let Pflanze = "Boskop";
         document.getElementById("id_Pflanzen_Name").value = Pflanze;
      </script>
   </head>
   <body>
      <form name='fo' method='Post' action='./'>
         <table class='Tabelle'>
            <tr>
               <td colspan='2' class='Zelle_Uberschrift'><script type="text/javascript">document.write(Pflanze)</script></td>
            </tr>
            <tr class='Zeile'>
               <td class='Zelle'>Pflanze-Name<input class='Textfeld_Name' type='text' name='Na_Pflanzen_Name' id='id_Pflanzen_Name' /></td>
            <tr>
         </table>
      </form>
   </body>
</html>

Gruß


RE: Variable in Input <type='text'> ausgeben - rzscout - 18.06.2022

Hi Faultier_1982,
der Ansatz ist schon mal richtig aber da fehlt noch was. Du solltest kein document.write verwenden. Hier kannst du lieber das entsprechende Element in JavaScript selektieren und dann den Inhalt via innerText,  innerHTML oder textContent. Bevor du aber auf Elemente zugreifst solltest du überprüfen ob der DOM geladen wurde - sprich der HTML-Code. Das kannst du mithilfe eines EventListener und einem Event namens 'DOMContentLoaded'.

Hier eine folgende Lösung:
Code:
'use strict';
document.addEventListener('DOMContentLoaded', () => {
let pflanze = 'Kaktus';
document.getElementById('id_Pflanzen_Name').value = pflanze;
});

Viel Erfolg!

VG rzscout