ტეგი label
ტეგი label ასახელებს ჭდეს შეყვანის ველისთვის
ტიპის input,
textarea,
select
და ა.შ.
ჭდე კონკრეტულ შეყვანის ველთან არის მიბმული
ატრიბუტის for საშუალებით. მასში
უნდა იყოს მითითებული id
ატრიბუტის მნიშვნელობა იმ შეყვანის ველისა, რომელთანაც ჭდეა მიბმული. ასევე
ჭდე მიბმულია ელემენტთან, თუ ეს
ელემენტი მოთავსებულია ტეგის label შიგნით. ამ
შემთხვევაში ატრიბუტი for არ არის საჭირო. უკეთესად გასაგებად იხილეთ
მაგალითები.
ჭდეზე დაწკაპუნებით მასთან მიბმული ჩეკბოქსები ან რადიო ღილაკები შეიცვლიან თავიანთ მდგომარეობას მონიშნულიდან არამონიშნულზე და პირიქით. ჭდე ამ შემთხვევაში მოხერხებულობისთვისაა საჭირო: ფორმის პატარა ელემენტებზე მაჩვენებლის მოხვედრა რთულია, ხოლო გრძელი, ტექსტური ჭდის მოხვედრა - ბევრად უფრო მარტივი.
ჭდესთან მიბმული ტექსტური შეყვანის ველი
ტიპის input
და textarea
მიიღებს შეყვანის ფოკუსს. ფოკუსი
- ეს არის როდესაც კურსორი ციმციმებს შეყვანის ველში,
ამ შემთხვევაში, თუ კლავიატურაზე რამეს აკრიფებთ - ტექსტი ამ ველში
შევა (იხ. ფსევდოკლასი focus
ფოკუსის გაღრმავებული გასაგებად).
ჭდე label შეიძლება გამოყენებულ იქნას
ჩეკბოქსის
ან რადიო
ღილაკის სიმულაციისთვის. ეს საჭიროა იმისთვის, რომ შექმნათ
checkbox ან radio საკუთარი დიზაინით (რაც
CSS-ზე აკრძალულია, მაგრამ ჭკვიანური მიღებების საშუალებით
შესაძლებელია).
ატრიბუტები
| ატრიბუტი | აღწერა |
|---|---|
for |
ამ ატრიბუტში უნდა იყოს მითითებული ატრიბუტი id-ის მნიშვნელობა
იმ შეყვანის ველისა, რომელთანაც არის მიბმული ჭდე label.
|
accesskey |
ასახელებს ცხელ ღილაკს, რომლის საშუალებითაც შესაძლებელია ჭდესთან მიბმულ
(ატრიბუტის for საშუალებით) ფორმის ელემენტზე გადასვლა.
დეტალებისთვის იხ. ატრიბუტი accesskey.
|
მაგალითი . ჩეკბოქსი
მოდით ჩეკბოქს checkbox-ს
მივაბათ ჭდე ატრიბუტის for საშუალებით.
დააწკაპუნეთ ჭდეზე და დაინახავთ ჩეკბოქსის მდგომარეობის ცვლილებას
მონიშნულიდან არამონიშნულზე და პირიქით:
<input type="checkbox" id="checkbox">
<label for="checkbox">მე id checkbox-ის მქონე ჩეკბოქსთან ვარ მიბმული.</label>
:
მაგალითი . label-ის შიგნით
ახლა კი მოდით არ მივაბათ ჭდე
ატრიბუტის for საშუალებით, არამედ ჩავსვათ ელემენტები უშუალოდ
ტეგის label შიგნით, ამ შემთხვევაში ტექსტზე label დაწკაპუნება
ასევე გამოიწვევს ელემენტის აქტივაციას:
<label><input type="checkbox"> ჭდე</label>
:
მაგალითი . ტექსტური შეყვანის ველი
მოდით ტეგს input
მივაბათ ჭდე ატრიბუტის for საშუალებით.
ჭდეზე დაწკაპუნება გამოიწვევს შეყვანის ველის მიერ
ფოკუსის მიღებას. ამ დროს ველში არსებული
ტექსტი (დავამატებთ ატრიბუტის
value საშუალებით)
გახდება მონიშნული. თუ კლავიატურაზე რამეს აკრიფებთ - ეს ტექსტი გაქრება.
მონიშვნის მოშორება, ტექსტის წაშლის გარეშე, შესაძლებელია
მაუსის დაწკაპუნებით შეყვანის ველზე: ფოკუსი
ამ დროს არ გაქრება, მაგრამ მონიშვნა ქრება:
<input type="text" id="input1" value="რაღაც ტექსტი">
<label for="input1">მე id input1-ის მქონე ინპუთთან ვარ მიბმული.</label>
:
იხილეთ აგრეთვე
-
ტეგი
legend,
რომელიც ასახელებს წარწერას ველების დაჯგუფებაზე
