Učení HTML část 31: Používání prvků textarea ve formulářích HTML
V této diskusi budeme studovat použití prvků textarea ve formách HTML. Tento prvek je prvek, který se na webu nejčastěji používá.
Pokusím se vysvětlit co nejpodrobnějitýkající se použití následujících prvků textarea s jejich atributy, jmenovitě řádků a sloupců. Obecně prvek <textarea> ... </texraea> se používá k zadávání dat do textového pole. Pro více informací o těchto prvcích a atributech se podívejme na níže uvedený tutoriál
<textarea>
Značka <textarea> se používá k vytvořenítextové pole, které má textovou oblast. Jeho použití je označeno použitím značky <textarea> jako předpony a značky </textarea> jako uzavření. Zde je příklad kódu:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Elemen Textarea pada Form HTML</title>
</head>
<body>
<form action="proses_input.php" method="get">
<textarea name="memo">Masukkan teks disini....</textarea>
<br>
<input type="submit">
</form>
</body>
</html>
Po spuštění v prohlížeči jsou výsledky následující:
Tato značka podporuje několik atributů, jako je název, řádky, sloupce, maximální délka, požadovaná atd.
1. Řádek Atribut
K určení částky se používá atribut řádkyřádek v textarea. Hodnoty tohoto atributu jsou čísla jako 40, 10 nebo s procenty jako 20%. Čím větší hodnota, tím vyšší je prvek textarea. Níže je uveden příklad psaní a použití atributu řádky ve značce <textarea> v HTML:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Atribut Rows pada Elemen Textarea</title>
</head>
<body>
<form action="proses_input.php" method="get">
<textarea name="memo" rows="15">Masukkan teks disini....</textarea>
<br>
<input type="submit">
</form>
</body>
</html>
Po provedení výše uvedeného kódu v prohlížeči se objeví následující obrázek:
2. Atributy Cols
Atribut cols se používá k určení šířky(počet sloupců) v elementu textarea. Podobně jako u atributů řádků mohou být hodnoty v tomto atributu čísla jako 80, 20 nebo 20%. Čím větší hodnota, tím širší je prvek textarea. Níže je uveden příklad kódu pro psaní a použití atributu cols ve značce <textarea> v HTML:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Atribut Cols pada Elemen Textarea</title>
</head>
<body>
<form action="proses_input.php" method="get">
<textarea name="memo" cols="50">Masukkan teks disini....</textarea>
<br>
<input type="submit">
</form>
</body>
</html>
Po provedení výše uvedeného kódu v prohlížeči se objeví následující obrázek:
Oba příklady používají atributy řádků a sloupcůvýše ukázala rozdíly v použití atributů řádků a sloupců v prvku textarea. Přesněji řečeno, atribut rows slouží k nastavení výšky, zatímco atribut cols slouží k nastavení šířky v elementu <textarea>. Následuje příklad psaní a použití atributů řádků a sloupců ve značce <textarea> v HTML:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Atribut Rows dan Cols pada Elemen Textarea</title>
</head>
<body>
<form action="proses_input.php" method="get">
<textarea name="memo" rows="15" cols="50">Masukkan teks disini....</textarea>
<br>
<input type="submit">
</form>
</body>
</html>
Po provedení výše uvedeného kódu v prohlížeči se objeví následující obrázek:
3. Atribut maximální délky
Tento atribut se vztahuje také na značku TextArea, která má funkci omezit počet znaků zadaných v TextArea. Příklad kódu jako je tento:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Atribut Maxlength pada Elemen Textarea</title>
</head>
<body>
<form action="proses_input.php" method="get">
<textarea name="memo" rows="10" cols="30" maxlength="40">Masukkan teks disini....</textarea>
<br>
<input type="submit">
</form>
</body>
</html>
Při spuštění v prohlížeči je výsledek následující:
Ve výše uvedeném kódu jsem nastavil maximální délku na 40, takže můžete zadat maximálně 40 znaků, ne více.
4. Atributy povinné
Nejen atribut maximální délky, požadovaný atributtaké se používá v textarea. Tato funkce atributu se používá k nastavení prvku (v tomto případě textarea), který má být před odesláním vyžadován. Příklad kódu HTML, jako je tento:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Atribut Maxlength pada Elemen Textarea</title>
</head>
<body>
<form action="proses_input.php" method="get">
<textarea name="memo" rows="10" cols="30" required></textarea>
<br>
<input type="submit">
</form>
</body>
</html>
Vypadá to v prohlížeči takto:
Když kliknete přímo na tlačítko Odeslat, dostanete upozornění jako na obrázku výše, což znamená, že musíte nejprve vyplnit textarea před kliknutím na tlačítko Odeslat.
To je materiál týkající se použití textareaFormulář HTML, textarea lze použít i mimo formulář HTML, takže to není jen pro formuláře HTML. Nezapomeňte na tento blog navštěvovat a získejte nejnovější návody o HTML.