jquery-logo

jQuery ile Checkbox Kontrolü

Merhaba arkadaşlar,

Bu makalemde yine jQuery ile bir kontrol işlemi gerçekleştiriyoruz. jQuery ile bir checkbox’ın(seçim kutusunun) seçili olup olmadığını nasıl kontrol edebileceğimizi anlatıyorum. Bunun için checked attribute’una bakacağız(kusura bakmayın attribute kelimesinin türkçe karşılığı nedir bilmiyorum). Önce bir adet input oluşturalım:

<input id="sec" type="checkbox" value="1" /> Seçersen alert verir

Şimdi bu input seçildiğinde alert ile ekrana seçim kutusunun işaretlendiğini belirtelim:

$(document).ready(function(){
    $("#sec").click(function(){
        if( $("#sec").attr("checked")=="checked" ) {
            alert("Seçim kutusu işaretlendi..");
        }
        else {
            alert("Seçim kutusu işareti kaldırıldı");
        }
    });
});

GÜNCELLEME (26 Kasım 2016)

Chrome’un artık checked özelliği ile işaretlemediğini farkettim checkbox’ları. O nedenle ekstra bir yöntem paylaşmak istedim:

$(document).ready(function(){
    $("#sec").click(function(){
        if( $("#sec").is(':checked') ) {
            alert("Seçim kutusu işaretlendi..");
        }
        else {
            alert("Seçim kutusu işareti kaldırıldı");
        }
    });
});

Yukarıdaki javascript kodunun neler yaptığını anlatalım.. Öncelikle id=”sec” olan elementine tıklandığında if…else ile id=”sec” elementinin checked niteliğine bakıyoruz. eğer checked=”checked” şeklinde ise işaretlendiğini belirtiyor ve seçim kutusu işaretlendi alerti veriyor. Eğer tekrar tıklanıp işaret kaldırılırsa yine aynı kontroller yapılıyor fakat bu sefer checked=”checked” olmadığı için seçim kutusu işareti kaldırıldı alerti veriliyor.
Umarım anlatabilmişimdir arkadaşlar, basit bir işlem zaten.
Kolay gelsin,

Post Author: Oral ÜNAL

Web geliştirmeyi başta meslek olarak hayal eden fakat daha sonra bir hobi haline getiren birisiyim işte.

Yorum yazma sırası sizde!