Cara Mengambil Nilai Checkbox Dengan Jquery

Hallo, Jumpa lagi dengan saya, di panduan kali ini saya akan bahas mengenai bagaimana Cara Mengambil Nilai Checkbox Dengan Jquery, tujuan nya ialah tak lain dan tak bukan supaya kita dapat mengambil atau mencetak nilai yang telah kita tentukan, bagus seketika saja kita praktekan.





Pertama-tama-tama tentu kita bikin dulu sebuah format inputan, disini saya menggunakan element Checkbox, seperti berikut.



<body>
Pilih:
<input type=checkbox id=Apel value=Buah Apel> apel
<input type=checkbox id=Mangga value=Buah Mangga> Mangga
<input type=checkbox id=Jeruk value=Buah Jeruk> Jeruk
<br><br>
<button id=cetak>Cetak</button>
</body>


Di kode diatas saya telah menentukan id masing-masing yaitu : Apel, Mangga, dan Jeruk. Kemudian berikutnya kita akan bikin proses nya dengan kode Jquery berikut.



<script>
$(document).ready(function() {

$(#cetak).click(function() {
var nilai1 = $(#Apel:checked).val();
var nilai2 = $(#Mangga:checked).val();
var nilai3 = $(#Jeruk:checked).val();

if (nilai1==undefined) {nilai1=;}
if (nilai2==undefined) {nilai2=;}
if (nilai3==undefined) {nilai3=;}

alert(nilai1 + + nilai2 + + nilai3);
})

});
</script>


Di pengambilan ini saya menggunakan guna  val(), yang berfungsi bagi memilih dan kemudian mencetak nilai yang kita pilih, diatas saya telah deklasaikan bahwa bagi id yang nilai nya apel saya kasih variable nilai 1, begitupun buah yang lain nya telah saya sesuaikan, dapat dilihat di atas.



Berikutnya, bagi menjalankan program diatas kalian mesti load dulu library jquery berikut, di kasus ini saya memakai cara online dan ketika kalian mau menjalankan program ini tentu kalian mesti terkoneksi internet, tapi jangan khawatir bikin kalian yang belum dapat konek internet kalian dapat merancang nya jadi offline, cara nya betul-betul gampang kalian buka kode berikut.



https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js



kemudian kalian simpan di folder, dibawah ini ialah cara online saya.



<script src=https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js></script>


Oke, kalau telah silahkan kalian jalankan dibrowser masing-masing, dan lihat hasilnya, tinggal kalian pilih dan kemudian cetak. Bagus hingga disini panduan mengenai Cara Mengambil Nilai Checkbox Dengan Jquery, semoga bermanfaat, amin.



Selamat mencoba 🙂




Sumber https://kursuswebsite.org

Popular posts from this blog

Cara Menghapus Isi Dari Form Input Menggunakan Javascript

Membuat Form Menarik Menggunakan HTML dan CSS