Formularz HTML - atrybut "placeholder"
- Data publikacji
- Ostatnio edytowano
Spójrzmy na następujący kod HTML:
<form action="https://webkod.pl/php/submit-result.php">
<p>
<label>
Podaj czterocyfrową liczbę:
<input type="text" name="liczba" pattern="[0-9]{4}">
</label>
</p>
<p>
<button type="submit">zatwierdź</button>
</p>
</form>
Rezultat:
Nasz przykładowy kod HTML reprezentuje formularz HTML, który z kolei reprezentowany jest przez element form
.
W zawartości naszego przykładowego formularza HTML występuje jeden element HTML, który może przechowywać informację wprowadzoną przez użytkownika.
Wspomnianym elementem HTML jest element input
.
Jeżeli z jakiejś przyczyny chcemy określić treść, jaka ma pojawić się w widocznym obszarze interesującego nas elementu HTML (w tym wypadku interesującego nas elementu input
), gdy wspomniany interesujący nas element HTML w danym momencie nie reprezentuje żadnej innej treści, wtedy do wspomnianego interesującego nas elementu HTML należy dodać atrybut placeholder wraz z interesującą nas wartością.
Przykład:
<form action="https://webkod.pl/php/submit-result.php">
<p>
<label>
Podaj czterocyfrową liczbę:
<input type="text" name="liczba" pattern="[0-9]{4}" placeholder="np. 1234">
</label>
</p>
<p>
<button type="submit">zatwierdź</button>
</p>
</form>
Rezultat:
Od tej pory, dzięki temu, że do naszego przykładowego elementu input
posiadającego atrybut name
o wartości liczba
został dodany atrybut placeholder
wraz z wartością np. 1234
, w momencie gdy do wspomnianego elementu input
nie została wprowadzona żadna wartość, wspomniany element input
w swoim widocznym obszarze posiada treść w postaci ciągu znaków np. 1234
.