Obtener el valor de la casilla de verificación en jQuery

¿Cómo puedo obtener el valor de una casilla de verificación en jQuery?

Para obtener el valor del atributo Value, puede hacer algo como esto:

$("input[type='checkbox']").val();

O si ha configurado un classo idpara ello, puede:

$('#check_id').val();
$('.check_class').val();

Sin embargo, esto devolverá el mismo valor si está marcado o no, esto puede ser confuso ya que es diferente al comportamiento del formulario enviado.

Para verificar si está marcado o no, haga lo siguiente:

if ($('#check_id').is(":checked"))
{
  // it is checked
}

Esas 2 formas están funcionando:

• $('#checkbox').prop('checked')
• $('#checkbox').is(':checked')(gracias @mgsloan)

$('#test').click(function() {
    alert("Checkbox state (method 1) = " + $('#test').prop('checked'));
    alert("Checkbox state (method 2) = " + $('#test').is(':checked'));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
Check me: <input id="test" type="checkbox" />

Prueba esta pequeña solución:

$("#some_id").attr("checked") ? 1 : 0;

o

$("#some_id").attr("checked") || 0;

Las únicas formas correctas de recuperar el valor de una casilla de verificación son las siguientes

if ( elem.checked ) 
if ( $( elem ).prop( "checked" ) ) 
if ( $( elem ).is( ":checked" ) ) 

como se explica en las documentaciones oficiales en el sitio web de jQuery. El resto de los métodos no tiene nada que ver con la propiedad de la casilla de verificación, están verificando el atributo, lo que significa que están probando el estado inicial de la casilla de verificación cuando se cargó. En resumen:

• Cuando tenga el elemento y sepa que es una casilla de verificación, simplemente puede leer su propiedad y no necesitará jQuery para eso (es decir elem.checked) o puede usarlo $(elem).prop("checked")si desea confiar en jQuery.
• Si necesita saber (o comparar) el valor cuando se cargó el elemento por primera vez (es decir, el valor predeterminado), la forma correcta de hacerlo es $(elem).is(":checked").

Las respuestas son engañosas, por favor verifique usted mismo a continuación

http://api.jquery.com/prop/

Solo para aclarar cosas:

$('#checkbox_ID').is(":checked")

Devolverá 'verdadero' o 'falso'

$('#checkbox_id').val();
$('#checkbox_id').is(":checked");
$('#checkbox_id:checked').val();

jQuery(".checkboxClass").click(function(){
        var selectedCountry = new Array();
        var n = jQuery(".checkboxClass:checked").length;
        if (n > 0){
            jQuery(".checkboxClass:checked").each(function(){
                selectedCountry.push($(this).val());
            });
        }
        alert(selectedCountry);
    });

Simple pero efectivo y supone que sabes que la casilla de verificación se encontrará:

$("#some_id")[0].checked;

Da true/false

//By each()
var testval = [];
 $('.hobbies_class:checked').each(function() {
   testval.push($(this).val());
 });


//by map()
var testval = $('input:checkbox:checked.hobbies_class').map(function(){
return this.value; }).get().join(",");

 //HTML Code

 <input type="checkbox" value="cricket" name="hobbies[]"  class="hobbies_class">Cricket 
  <input type="checkbox" value="hockey" name="hobbies[]" class="hobbies_class">Hockey

Demo de ejemplo

A pesar de que esta pregunta está pidiendo una solución jQuery, aquí hay una respuesta pura de JavaScript ya que nadie la ha mencionado.

Sin jQuery:

Simplemente seleccione el elemento y acceda a la checkedpropiedad (que devuelve un valor booleano).

var checkbox = document.querySelector('input[type="checkbox"]');

alert(checkbox.checked);

<input type="checkbox"/>

Aquí hay un ejemplo rápido escuchando el changeevento:

var checkbox = document.querySelector('input[type="checkbox"]');
checkbox.addEventListener('change', function (e) {
    alert(this.checked);
});

<input type="checkbox"/>

Para seleccionar elementos marcados, use la :checkedpseudo clase ( input[type="checkbox"]:checked).

Aquí hay un ejemplo que itera sobre los inputelementos marcados y devuelve una matriz mapeada de los nombres de los elementos marcados.

Ejemplo aquí

var elements = document.querySelectorAll('input[type="checkbox"]:checked');
var checkedElements = Array.prototype.map.call(elements, function (el, i) {
    return el.name;
});

console.log(checkedElements);

var elements = document.querySelectorAll('input[type="checkbox"]:checked');
var checkedElements = Array.prototype.map.call(elements, function (el, i) {
    return el.name;
});

console.log(checkedElements);

<div class="parent">
    <input type="checkbox" name="name1" />
    <input type="checkbox" name="name2" />
    <input type="checkbox" name="name3" checked="checked" />
    <input type="checkbox" name="name4" checked="checked" />
    <input type="checkbox" name="name5" />
</div>

Aquí se explica cómo obtener el valor de todas las casillas marcadas como una matriz:

var values = (function() {
                var a = [];
                $(".checkboxes:checked").each(function() {
                    a.push(this.value);
                });
                return a;
            })()

para obtener el valor de checkboxex marcado en jquery:

var checks = $("input[type='checkbox']:checked"); // returns object of checkeds.

for(var i=0; i<checks.length; i++){
    console.log($(checks[i]).val()); // or do what you want
});

en pure js:

var checks = document.querySelectorAll("input[type='checkbox']:checked");

for(var i=0; i<checks.length; i++){
    console.log(checks[i].value); // or do what you want
});

Utiliza el siguiente código:

$('input[name^=CheckBoxInput]').val();

$('.class[value=3]').prop('checked', true);

La mejor manera es $('input[name="line"]:checked').val()

Y también puedes obtener el texto seleccionado $('input[name="line"]:checked').text()

Agregue un atributo de valor y nombre a sus entradas de botón de radio. Asegúrese de que todas las entradas tengan el mismo atributo de nombre.

<div class="col-8 m-radio-inline">
    <label class="m-radio m-radio-filter">
        <input type="radio" name="line" value="1" checked> Value Text 1
    </label>
    <label class="m-radio m-radio-filter">
        <input type="radio" name="line" value="2"> Value Text 2
    </label>
    <label class="m-radio m-radio-filter">
        <input type="radio" name="line" value="3"> Value Text 3
    </label>
</div>

<script type="text/javascript">
$(document).ready(function(){
    $('.laravel').click(function(){
        var val = $(this).is(":checked");
        $('#category').submit();
    });
});

<form action="{{route('directory')}}" method="post" id="category">
                        <input type="hidden" name="_token" value="{{ csrf_token() }}">
                        <input name="category" value="{{$name->id}}"  class="laravel" type="checkbox">{{$name->name}}
                      </form>

Solo atención, a partir de hoy, 2018, debido al cambio de la API a lo largo de los años. removeAttr están depricados, ¡ya no funcionan!

Marque o desmarque una casilla de verificación:

Malo, ya no funciona.

   $('#add_user_certificate_checkbox').removeAttr("checked");

   $('#add_user_certificate_checkbox').attr("checked","checked");

En cambio, debes hacer:

      $('#add_user_certificate_checkbox').prop('checked', true);
      $('#add_user_certificate_checkbox').prop('checked', false);