HTML tanulás 31. rész: Textarea elemek használata HTML űrlapokban

Ebben a beszélgetésben megvizsgáljuk a textarealemek használatát HTML formákban. Ez az elem a webhelyen leggyakrabban használt elem.

Megpróbálom a lehető leg részletesebben magyaráznia következő textarealemek használatát illetően, attribútumaikkal, nevezetesen a sorokkal és az oszlopokkal. Általában a <textarea> elem ... Az </texraea> adatmezőbe történő bevitelre szolgál. Az elemekről és az attribútumokról bővebben az alábbiakban olvashat

<textarea> címke

A <textarea> címkét aszövegmezővel rendelkező szövegmező. Használatát az jelzi, hogy a <textarea> címke előtagként, az </textarea> címke pedig záróként használatos. Íme egy példakód:

<!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>

A böngészőben történő futtatás után az eredmények a következők:

Ez a címke több attribútumot támogat, mint például név, sorok, oszlopok, maximális hossz, szükséges és így tovább.

1. Sorok attribútuma

A rows attribútumot használják az összeg meghatározásárasor textarea-ban. Ennek az attribútumnak az értékei lehetnek 40, 10 vagy százalék, például 20%. Ahol nagyobb az érték, annál nagyobb a textarea elem. Az alábbiakban bemutatunk egy példát a HTML <textarea> címkéjében a rows attribútum írására és használatára:

<!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>

A fenti kód végrehajtása után a böngészőben az alábbiak szerint jelenik meg:

2. Cols Attribútum

A cols attribútumot használják a szélesség meghatározására(oszlopok száma) a textarealemben. A rows attribútumhoz hasonlóan ezen attribútum értékei is lehetnek, például 80, 20 vagy 20%. Ahol nagyobb az érték, annál szélesebb a textarea elem. Az alábbiakban bemutatunk egy példát a HTML kód <textarea> címkéjében a cols attribútum írására és használatára szolgáló kódra:

<!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>

A fenti kód végrehajtása után a böngészőben az alábbiak szerint jelenik meg:

Mindkét példa a sorok és az oszlopok attribútumait használjaA fenti különbségeket mutatott a sorok és oszlopok attribútumának használata a textarea elemben. Pontosabban: a rows attribútum a magasság beállításához, míg a cols attribútum a szélesség beállításához szolgál a <textarea> elemben. Az alábbiakban bemutatunk egy példát a sorok és oszlopok attribútumainak együttes írására és felhasználására a HTML <textarea> címkéjén:

<!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>

A fenti kód végrehajtása után a böngészőben az alábbiak szerint jelenik meg:

sorok és oszlopok kombinációja a textareában

3. A maximális tulajdonság

Ez az attribútum a TextArea címkékre is vonatkozik, amelyeknek a funkciója a TextAreabe beírt karakterek számának korlátozására szolgál. Példa a következő kódra:

<!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>

Böngészőben történő futtatás esetén az eredmény így lesz:

A fenti kódban a maximális hosszúságot 40-re állítottam, így legfeljebb 40 karaktert írhat be, nem többet.

4. Szükséges attribútumok

Nem csak a maximlength, hanem a szükséges attribútumot istextarea-ban is használják. Ez az attribútum funkció az elem (ebben az esetben a textarea) beállításához szükséges a benyújtás előtt. Példa a HTML kódra:

<!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>

A böngészőben így néz ki:

Ha közvetlenül kattint a benyújtás gombra, akkor értesítést kap a fenti képen láthatóhoz hasonlóan, azaz először ki kell töltenie a szöveget, mielőtt a benyújtás gombra kattint.

Ez az anyag a textarea használatánálA HTML űrlap, a textarea a HTML űrlapon kívül is használható, tehát nem csak a HTML űrlapokhoz. Ne felejtsd el továbbra is meglátogatni ezt a blogot, hogy megkapd a legfrissebb oktatóanyagokat a HTML-ről.

</ P>

Tovább: