3.1 Element <input type="button">
<input type="button"> elementi, standart davranışı olmayan bir düymə yaratmaq üçün istifadə olunur. Submit və reset düymələrindən fərqli olaraq, hansı ki basıldığında müəyyən hərəkətləri yerinə yetirir, button düyməsi adətən müəyyən tapşırıqları icra etmək üçün JavaScript ilə birlikdə istifadə olunur.
İstifadə nümunəsi:
<input type="button" value="Click Me" onclick="alert('Düymə basıldı!')">
Əsas atributlar:
1. value atributu: düymənin üzərində göstəriləcək mətni təyin edir.
<input type="button" value="Click Me">
2. onclick atributu: düyməyə basıldığında yerinə yetiriləcək JavaScript funksiyasını təyin edir.
<input type="button" value="Click Me" onclick="myFunction()">
function myFunction() {
alert('Düymə basıldı!');
}
İstifadə nümunələri:
JavaScript funksiyasının çağırılması:
<input type="button" value="Show Alert" onclick="showAlert()">
function showAlert() {
alert('Bu bir alertdir!');
}
Elementin stilinin dəyişdirilməsi:
<input type="button" value="Change Color" onclick="changeColor()">
<p id="text">Bu bir paraqrafdır.</p>
function changeColor() {
document.getElementById('text').style.color = 'blue';
}
3.2 <input type="checkbox"> Elementi
<input type="checkbox"> elementi istifadəçilərə təklif olunan variantlardan birini və ya bir neçəsini seçməyə imkan verən checkbox yaratmaq üçün istifadə olunur. Checkbox aktiv və ya passiv ola bilər.
İstifadə nümunəsi:
<label for="subscribe">Subscribe to newsletter:</label>
<input type="checkbox" id="subscribe" name="subscribe" value="yes">
Əsas atributlar:
1. name atributu: Form elementinin adını təyin edir, bu ad məlumatlarla birlikdə serverə göndəriləcək.
<input type="checkbox" name="subscribe">
2. value atributu: Checkbox aktiv olduqda serverə göndəriləcək dəyəri təyin edir.
<input type="checkbox" name="subscribe" value="yes">
3. checked atributu: Checkbox-un default olaraq aktiv olub-olmadığını təyin edir.
<input type="checkbox" name="subscribe" value="yes" checked>
İstifadə nümunələri:
Bir neçə checkbox:
<p>Maraqlarınızı seçin:</p>
<input type="checkbox" name="interest" value="sports">İdman<br>
<input type="checkbox" name="interest" value="music">Musiqi<br>
<input type="checkbox" name="interest" value="movies">Filmlər<br>
Default olaraq seçilmiş checkbox:
<input type="checkbox" name="terms" value="agree" checked> Şərtlərlə razıyam
3.3 Element <input type="radio">
Radiobutton seçimi üçün sahə (type="radio")
Element <input type="radio"> istifadə olunur «radiobutton»-lar yaratmaq üçün, hansı ki, istifadəçilərə qrupda yalnız bir seçimi seçməyə imkan verir. Radiobutton-lar qruplara qoşulur eyni atribut dəyəri ilə name.
İstifadə nümunəsi:
<p>Cinsinizi seçin:</p>
<input type="radio" id="male" name="gender" value="male">
<label for="male">Kişi</label><br>
<input type="radio" id="female" name="gender" value="female">
<label for="female">Qadın</label><br>
Əsas atributlar:
Atribut name: radiobutton qrupunun adını təyin edir. Bir qrupda olan bütün radiobutton-lar eyni ada sahib olmalıdır və istifadəçi onlardan yalnız birini seçə bilər.
<input type="radio" name="gender" value="male">
<input type="radio" name="gender" value="female">
Atribut value: seçilmiş radiobutton serverə göndərilən dəyəri təyin edir.
<input type="radio" name="gender" value="male">
Atribut checked: radiobutton-un ilkin olaraq seçilmiş olmalı olub-olmamasını müəyyən edir.
<input type="radio" name="gender" value="male" checked>
İstifadə nümunələri:
Bir seçim üçün radiobutton qrupu:
<p>Bir rəng seçin:</p>
<input type="radio" name="color" value="red">Qırmızı<br>
<input type="radio" name="color" value="green">Yaşıl<br>
<input type="radio" name="color" value="blue">Mavi<br>
Öncədən təyin olunmuş dəyərə sahib radiobutton:
<input type="radio" name="subscription" value="monthly" checked>Aylıq<br>
<input type="radio" name="subscription" value="yearly">İllik<br>
GO TO FULL VERSION