JavaScript Dersleri – Checkboxların Tümünü Seç veya Seçimi Kaldır

Kategori: js Perşembe, 14 Mayıs 2020 tarihinde yayınlandı. Super User tarafından yazıldı.

Daha önceki JavaScript derslerimizde Checkbox kullanımını anlatıp seçili olan nesnelerin değerlerinin nasıl okunacağından bahsetmiştik, şimdi de farklı bir uygulama ile form içerisinde yer alan tüm Checkboxların seçili hale getirilmesi veya seçimin iptal edilmesi nasıl yapılacak onu açıklayalım. Kodlamaya geçmeden işlemin mantığını açıklayalım

İlk olarak form içerisine kontrol edilecek nesneler ekleniyor, yazdığımız script kodunda form içindeki tüm Checkboxlar bir değişkene aktarılıyor ve döngü içinde sırayla seçili ise iptal seçili değilse hepsi seçili hale geliyor 🙂

<script type="text/javascript">// <![CDATA[
  checked = false;
function tumunusec (checkboxornek) {
var checkboxlar= document.getElementById('checkboxornek');
if (checked == false)
{
checked = true
}
else
{
checked = false
}
for (var i =0; i < checkboxlar.elements.length; i++)
{
 checkboxlar.elements[i].checked = checked;
}
}
// ]]></script>
 <b>Checkboxları Seçili Hale Getirme veya İptal Etme</b></pre>
<form id="checkboxornek"><input type="checkbox" name="kutu1" /><input type="checkbox" name="kutu2" />
<input type="checkbox" name="kutu3" />
 
Tümünü Seç veya İptal Et
 
<input onclick="tumunusec();" type="checkbox" name="checkall" /></form>
<pre>
Gösterim: 122

Yorum ekle


Güvenlik kodu
Yenile