HTML mokymosi 31 dalis: „Textarea“ elementų naudojimas HTML formose

Šioje diskusijoje nagrinėsime teksto elementų naudojimą HTML formose. Šis elementas yra elementas, dažniausiai naudojamas svetainėje.

Pabandysiu paaiškinti kuo išsamiaudėl šių teksto juostos elementų naudojimo su jų požymiais, būtent eilutėmis ir brūkšneliais. Apskritai, <textarea> elementas ... </texraea> naudojamas duomenims įvesti į teksto lauką. Norėdami gauti daugiau informacijos apie šiuos elementus ir atributus, pažiūrėkime į žemiau pateiktą mokymo programą

<textarea> žyma

Žyma <textarea> naudojama kuriantteksto laukas, kuriame yra teksto sritis. Jos panaudojimas pažymimas kaip žymėjimas <textarea> kaip priešdėlis, o </textarea> žyma naudojama kaip uždarymas. Štai kodo pavyzdys:

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

Paleidę naršyklę, rezultatai yra tokie:

Ši žyma palaiko kelis atributus, tokius kaip vardas, eilutės, stulpeliai, maksimalus ilgis, reikalinga ir pan.

1. Eilučių atributas

Eilutės atributas naudojamas kiekiui nustatytilinija tekstare. Šio atributo reikšmės yra tokios, kaip 40, 10, arba procentai, pavyzdžiui, 20%. Kur didesnė vertė, tuo didesnis teksto juostos elementas. Toliau pateiktas atributo eilučių rašymas ir naudojimas HTML žymoje <textarea>:

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

Atlikus aukščiau pateiktą kodą naršyklėje, jis pasirodys taip, kaip parodyta žemiau:

2. Atšaldo atributas

Atributas cols naudojamas pločiui nustatyti(stulpelių skaičius) teksto srities elemente. Panašiai kaip atributų eilučių, šio atributo reikšmės gali būti tokios, kaip 80, 20 arba 20%. Kur didesnė vertė, tuo platesnis teksto elementas. Toliau pateiktas atributo cols rašymo ir naudojimo kodo pavyzdys HTML <textarea> žymoje:

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

Atlikus aukščiau pateiktą kodą naršyklėje, jis pasirodys taip, kaip parodyta žemiau:

Abiejuose pavyzdžiuose naudojami eilučių ir stulpelių atributaiaukščiau pavaizdavo eilučių ir stulpelių atributo naudojimo teksto elemente skirtumus. Tiksliau sakant, eilučių atributas skirtas aukščio nustatymui, o atributas stulpelis skirtas pločio nustatymui elemente <textarea>. Toliau pateiktas eilučių ir stulpelių atributų rašymo ir naudojimo kartu HTML žymą <textarea> pavyzdys:

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

Atlikus aukščiau pateiktą kodą naršyklėje, jis pasirodys taip, kaip parodyta žemiau:

eilučių ir stulpelių derinys teksto srityje

3. Maksimalus atributas

Šis požymis taip pat taikomas „TextArea“ žymoms, kurių funkcija yra apriboti „TextArea“ įvestų simbolių skaičių. Kodo pavyzdys:

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

Kai paleidžiate naršyklėje, rezultatas yra toks:

Aukščiau esančiame kode aš nustatiau maksimalų ilgį 40, taigi galite įvesti tik iki 40 ženklų, bet ne daugiau simbolių.

4. Reikalingi atributai

Ne tik ilgio atributas, reikalingas atributastaip pat naudojamas tekstare. Ši atributo funkcija naudojama norint nustatyti elementą (šiuo atveju teksto juostą), kurį reikia pateikti prieš pateikiant. HTML kodo pavyzdys:

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

Naršyklėje jis atrodo taip:

Tiesiogiai spustelėję mygtuką Pateikti, gausite pranešimą, kaip pavaizduota aukščiau esančiame paveikslėlyje, tai reiškia, kad prieš spustelėdami mygtuką Pateikti, pirmiausia turite užpildyti teksto lauką.

Tai yra medžiaga, susijusi su teksto juostos naudojimuHTML forma, teksto sritis taip pat gali būti naudojama už HTML formos ribų, taigi, tai ne tik HTML formoms. Nepamirškite ir toliau lankytis šiame tinklaraštyje, kad gautumėte naujausią HTML pamokymą.

</p>

Skaityti daugiau: