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.