HTML Themen

Layout

Gif nebeneinander

HTML: Inputfeld ausgrauen mit Readonly – So gehts

veröffentlicht am: 6. Dezember 2021

Oft ist es erforderlich, das bestimmte Daten in einem Inputfeld vom Benutzer nicht geändert werden können. Du kannst ein Input Feld ausgrauen so das man den Wert nur lesen aber nicht bearbeiten kann.

Inhaltsverzeichnis

HTML: Input Feld ausgrauen – Read Only

In diesem Beispiel wird dein Land angezeigt, du kannst es aber nicht ändern. Es wird mit readonly ausgegraut.

<form action="action.php"><label for="email">E-Mail: </label><input name="email" type="text" />
<label for="land">Land: </label><input name="land" readonly="readonly" type="text" value="Deutschland" />
<button type="submit">Anmelden</button></form>

Ergebnis

Du kannst es nun ausprobieren, den Wert für das Land kannst du jetzt nicht mehr ändern.

E-Mail: Land:

HTML Input Feld: Disable

Das disable Attribut legt fest das der Wert weder geändert werden soll noch das er bei der Formularübertragung mitgeschickt wird. Elemente mit disable werden von den gängingen Browsern ausgegraut.

<form>
   <fieldset id="persAngaben" disabled>
     <label for="input1">Benutzername</label> <input value="Hans" id="input1">
 
     <label for="input2">Passwort</label> <input type="password" value="Passwort" id="input2">

   </fieldset>
 </form>

Ergebnis

Benutzername

Passwort

Domi

Hi ich bin’s Dominik. Auf Blogseite.com findest du alles was mich interessiert. Mag Games, liebe SEO, programmiere gerne und möchte dir mit verschiedenen Themen die mich begeistern einen Mehrwert liefern. Viel Spaß auf meiner Seite

Hi !, Wohin möchtest du?

HTML Themen

Scripts

Schrift & Text

Farben

Link

Bilder

Elemente

Video

Weiterleitung

Icons

Audio

Layout

HTML: Inputfeld ausgrauen mit Readonly – So gehts

HTML: Input Feld ausgrauen – Read Only

Ergebnis

HTML Input Feld: Disable

Ergebnis

Das könnte dich interessieren!

Weitere Kategorien

Schreibe einen Kommentar Antworten abbrechen