jQuery ile Checkboxların ID'lerini Toplama Örneği

Bu örnekte, bir HTML div içine yerleştirilen 5 adet checkboxın her birinin ID'sini jQuery kullanarak almayı öğreneceksiniz.

jQuery kullanarak sayfada bulunan checkboxların ID'lerini toplamak oldukça yaygın bir işlemdir. Bu örnekte, bir dizi checkbox oluşturacağız ve her birinin ID'sini bir JavaScript listesine eklemek için jQuery'nin each() fonksiyonunu kullanacağız.

HTML Kodu Açıklaması:

HTML kodumuz, bir div içinde 5 adet checkbox oluşturur. Her bir checkbox'ın benzersiz bir ID'si vardır.

 <div id="checkboxContainer">
        <input type="checkbox" id="checkbox1"> Checkbox 1
        <input type="checkbox" id="checkbox2"> Checkbox 2
        <input type="checkbox" id="checkbox3"> Checkbox 3
        <input type="checkbox" id="checkbox4"> Checkbox 4
        <input type="checkbox" id="checkbox5"> Checkbox 5
    </div>

jQuery Kodu Açıklaması:

Aşağıda, checkbox'ların ID'lerini toplamak için jQuery kullanarak nasıl bir kod yazılacağını gösteren açıklama yer alıyor:

<script>
    $(document).ready(function () {
        var checkboxIDs = []; // Checkbox ID'lerini saklamak için bir dizi oluşturun

        // Checkbox'ların ID'lerini döngü ile toplayın
        $("#checkboxContainer input[type='checkbox']").each(function () {
            var checkboxID = $(this).attr("id"); // Her checkbox'ın ID'sini alın
            checkboxIDs.push(checkboxID); // ID'yi diziye ekleyin
        });

        // Toplanan ID'leri konsola yazdırabilirsiniz
        console.log(checkboxIDs);
    });
</script>

Bu kod, sayfa yüklendiğinde checkbox ID'lerini toplar ve bu ID'leri "checkboxIDs" adlı bir diziye ekler. Sonuçları konsola yazdırmak için console.log kullanabilirsiniz.

Kategoriler