Menguji apakah kotak centang dicentang dengan jQuery


588

Jika kotak centang dicentang, maka saya hanya perlu mendapatkan nilai sebagai 1; jika tidak, saya harus mendapatkannya sebagai 0. Bagaimana saya melakukan ini menggunakan jQuery?

$("#ans").val() akan selalu memberi saya hak dalam hal ini:

<input type="checkbox" id="ans" value="1" />

2
.val () adalah untuk mendapatkan atribut nilai, bukan status cek. Atribut nilai dapat berupa apa saja, tidak harus boolean.
Pablo Pazos

jika Anda masih ada, Anda mungkin ingin memperbarui jawaban yang diterima untuk perangkat lunak modern ... banyak orang masih melihat pertanyaan ini
xaxx

Jawaban:


1008

Gunakan .is(':checked')untuk menentukan apakah itu dicentang atau tidak, dan kemudian tetapkan nilainya sesuai.

Informasi lebih lanjut di sini.


1
Selain itu, ketika Anda melakukan $ ("# id"). Is ("dicentang") dalam klausa if Anda akan mendapatkan benar atau salah, tidak on / off, dengan kembali dan Anda dapat mengirimkannya ke skrip back-end Anda dan lakukan apapun yang kamu mau.
Zanoldor

1
Mungkin ini tidak masalah saat ini: ReSharper (saya kira) mengeluarkan peringatan " Kelas pseudo 'diperiksa' tidak kompatibel dengan Internet Explorer 8.0 ".
Uwe Keim

211
$("#ans").attr('checked') 

akan memberi tahu Anda jika sudah dicentang. Anda juga dapat menggunakan parameter kedua true / false untuk mencentang / menghapus centang pada kotak centang.

$("#ans").attr('checked', true);

Per komentar, gunakan propbukan attrsaat tersedia. Misalnya:

$("#ans").prop('checked')

90

Gunakan saja $(selector).is(':checked')

Ini mengembalikan nilai boolean.


56
// use ternary operators
$("#ans").is(':checked') ? 1 : 0;

@ Looic untuk menetapkan nilainya menggunakan sintaks terner terse, misalnya:: a = ischecked? 1: 0

21

Jawaban Stefan Brinkmann sangat baik, tetapi tidak lengkap untuk pemula (menghilangkan tugas variabel). Hanya untuk mengklarifikasi:

// this structure is called a ternary operator
var cbAns = ( $("#ans").is(':checked') ) ? 1 : 0;

Ini berfungsi seperti ini:

 var myVar = ( if test goes here ) ? 'ans if yes' : 'ans if no' ;

Contoh:

var myMath = ( 1 > 2 ) ? 'yes' : 'no' ;
alert( myMath );

Lansiran 'tidak'

Jika ini bermanfaat, harap jawab jawaban Stefan Brinkmann.



15

Saya telah menemukan masalah yang sama sebelumnya, semoga solusi ini dapat membantu Anda. pertama, tambahkan atribut khusus ke kotak centang Anda:

<input type="checkbox" id="ans" value="1" data-unchecked="0" />

tulis ekstensi jQuery untuk mendapatkan nilai:

$.fn.realVal = function(){
    var $obj = $(this);
    var val = $obj.val();
    var type = $obj.attr('type');
    if (type && type==='checkbox') {
        var un_val = $obj.attr('data-unchecked');
        if (typeof un_val==='undefined') un_val = '';
        return $obj.prop('checked') ? val : un_val;
    } else {
        return val;
    }
};

gunakan kode untuk mendapatkan nilai kotak centang:

$('#ans').realVal();

Anda dapat menguji di sini


10
... karena jQuery dikenal sebagai perpustakaan "the write more do less"
myshadowself

cerita panjang Anda telah pergi jauh JQUERY ingin pengembang untuk menulis lebih sedikit dan melakukan lebih banyak lagi. masalah sederhana layak solusi sederhana
ShapCyber

ya, setuju, kurang menulis, berbuat lebih banyak. Anda menulis ekstensi sekali, dan untuk sisa waktu, Anda hanya memanggil API $ (someradio) .realVal (), Anda tidak perlu menulis ekstensi berkali-kali.
alphakevin

Anda bahkan tidak perlu menulis ekstensi sekali, tidak pernah 'berkali-kali'! Oo
Coz


7
<input type="checkbox" id="ans" value="1" />

Jquery: var test= $("#ans").is(':checked') dan itu mengembalikan benar atau salah.

Dalam fungsi Anda:

$test =($request->get ( 'test' )== "true")? '1' : '0';


4

Menggunakan:

$("#ans option:selected").val()

jika tidak dipilih, maka bagian pertama tidak akan mengembalikan apa pun, kan?
xaxxon

@Senthil, OP tidak meminta untuk mendapatkan nilai dari kotak centang yang dipilih, melainkan return 1jika itu dipilih
Om Shankar

4
function chkb(bool){
if(bool)
return 1;
return 0;
}

var statusNum=chkb($("#ans").is(':checked'));

statusNum akan sama dengan 1 jika kotak centang dicentang, dan 0 jika tidak.

EDIT: Anda bisa menambahkan DOM ke fungsi juga.

function chkb(el){
if(el.is(':checked'))
return 1;
return 0;
}

var statusNum=chkb($("#ans"));

4

Baru-baru ini saya mengunjungi kasing di mana saya perlu memeriksa nilai kotak centang ketika pengguna mengklik tombol. Satu-satunya cara yang tepat untuk melakukannya adalah menggunakan prop()atribut.

var ansValue = $("#ans").prop('checked') ? $("#ans").val() : 0;

ini berhasil dalam kasus saya, mungkin seseorang akan membutuhkannya.

Ketika saya sudah mencoba .attr(':checked')mengembalikannya checkedtetapi saya ingin nilai boolean dan .val()nilai atribut dikembalikan value.


4

Ada beberapa pilihan yang ada ....

 1. $("#ans").is(':checked') 
 2. $("#ans:checked")
 3. $('input:checkbox:checked'); 

Jika semua opsi ini mengembalikan nilai true maka Anda dapat menetapkan nilai dengan lebih baik.


Yang pertama harus (': dicentang'), tidak berfungsi sebaliknya.
Arie Livshin

2

Coba ini

$('input:checkbox:checked').click(function(){
    var val=(this).val(); // it will get value from checked checkbox;
})

Di sini bendera benar jika dicentang sebaliknya salah

var flag=$('#ans').attr('checked');

Sekali lagi ini akan membuat cheked

$('#ans').attr('checked',true);


0

Anda bisa mendapatkan nilai (benar / salah) dengan dua metode ini

$("input[type='checkbox']").prop("checked");
$("input[type='checkbox']").is(":checked");

0

Pertama periksa nilainya dicentang

$("#ans").find("checkbox").each(function(){
    if ($(this).prop('checked')==true){ 
    var id = $(this).val()
    }
});

Set lain yang 0 nilai


0

Jika Anda ingin nilai integer dicentang atau tidak, coba:

$("#ans:checked").length

0

Anda dapat melakukannya, dengan cara ini:

$('input[id=ans]').is(':checked');     
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.