jQuery: prueba si la casilla de verificación NO está marcada

Tengo problemas para resolver esto. Tengo dos casillas de verificación (en el futuro tendré más):

• checkSurfaceEnvironment-1
• checkSurfaceEnvironment-2

Básicamente, quiero escribir una declaración if y probar si una de ellas está marcada y otra NO. ¿Cuál es la forma más sencilla de lograr lo siguiente?

if ( $("#checkSurfaceEnvironment-1").attr('checked', true) &&
     $("#checkSurfaceEnvironment-2").is('**(NOT??)** :checked') ) {
        // do something
}

Una forma confiable que uso es:

if($("#checkSurfaceEnvironment-1").prop('checked') == true){
    //do something
}

Si desea iterar sobre los elementos marcados, use el elemento principal

$("#parentId").find("checkbox").each(function(){
    if ($(this).prop('checked')==true){ 
        //do something
    }
});

Más información:

Esto funciona bien porque todas las casillas de verificación tienen una propiedad marcada que almacena el estado real de la casilla de verificación. Si lo desea, puede inspeccionar la página e intentar marcar y desmarcar una casilla de verificación, y notará que el atributo "marcado" (si está presente) seguirá siendo el mismo. Este atributo solo representa el estado inicial de la casilla de verificación y no el estado actual . El estado actual se almacena en la propiedad marcada del elemento dom para esa casilla de verificación.

Ver propiedades y atributos en HTML

if (!$("#checkSurfaceEnvironment-1").is(":checked")) {
    // do something if the checkbox is NOT checked
}

También puede usar el .not()método jQuery o el :not()selector:

if ($('#checkSurfaceEnvironment').not(':checked').length) {
    // do stuff for not selected
}

Ejemplo de JSFiddle

Notas adicionales

De la documentación de la API de jQuery para el :not() selector :

El método .not () terminará proporcionándole selecciones más legibles que presionando selectores o variables complejas en un filtro selector : not () . En la mayoría de los casos, es una mejor opción.

Una forma alternativa:

Aquí hay un ejemplo de trabajo y aquí está el código, también debe usar prop.

$('input[type="checkbox"]').mouseenter(function() { 
    if ($(this).is(':checked')) {
        //$(this).prop('checked',false);
        alert("is checked");
    } else {
         //$(this).prop('checked',true);
        alert("not checked");
    }
});​

Comenté la forma de alternar el atributo marcado.

if ( $("#checkSurfaceEnvironment-1").is(":checked") && $("#checkSurfaceEnvironment-2").not(":checked") )

Estaba buscando una implementación más directa como sugirió avijendr.

Tuve un pequeño problema con su sintaxis, pero logré que esto funcionara:

if ($('.user-forms input[id*="chkPrint"]:not(:checked)').length > 0)

En mi caso, tenía una mesa con una clase user-forms, y yo estaba revisando si alguna de las casillas de verificación que tenían la cadena checkPrinten su ideran sin marcar.

Creo que la forma más fácil (con jQuery) de verificar si la casilla de verificación está marcada o NO es:

si está 'marcado':

if ($(this).is(':checked')) {
// I'm checked let's do something
}

si NO está 'marcado':

if (!$(this).is(':checked')) {
// I'm NOT checked let's do something
}

Aquí tengo un fragmento de esta pregunta.

$(function(){
   $("#buttoncheck").click(function(){
        if($('[type="checkbox"]').is(":checked")){
            $('.checkboxStatus').html("Congratulations! "+$('[type="checkbox"]:checked').length+" checkbox checked");
        }else{
            $('.checkboxStatus').html("Sorry! Checkbox is not checked");
         }
         return false;
   })
    
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <p>
    <label>
      <input type="checkbox" name="CheckboxGroup1" value="checkbox" id="CheckboxGroup1_0">
      Checkbox</label>
    <br>
    <label>
      <input type="checkbox" name="CheckboxGroup1_" value="checkbox" id="CheckboxGroup1_1">
      Checkbox</label>
    <br>
  </p>
  <p>
    <input type="reset" value="Reset">
    <input type="submit" id="buttoncheck" value="Check">
  </p>
  <p class="checkboxStatus"></p>
</form>

Para hacerlo con lo .attr()que has hecho, para ver si está marcado estaría .attr("checked", "checked"), y si no lo está sería.attr("checked") == undefined

Devuelve verdadero si todas las casillas de verificación están marcadas en un div

function all_checked (id_div){
 all_checked = true;

 $(id_div+' input[type="checkbox"]').each(function() { 
    all_checked = all_checked && $('this').prop('checked');
 }

 return all_checked;
}

Condición simple y fácil de verificar o no verificar

<input type="checkbox" id="ev-click" name="" value="" >

<script>
    $( "#ev-click" ).click(function() {
        if(this.checked){
            alert('checked');
        }
        if(!this.checked){
            alert('Unchecked');
        }
    });
</script>

prueba este

if ($("#checkSurfaceEnvironment-1:checked").length>0) {
    //your code in case of NOT checked
}

En el código anterior, seleccione el elemento por Id y (#checkSurfaceEnvironment-1)luego filtre su estado verificado por (:checked)filtro.

Devolverá una matriz de objeto de elemento verificado. Si existe algún objeto en la matriz, entonces se cumplirá la condición.

Hay dos formas de comprobar la condición.

if ($("#checkSurfaceEnvironment-1").is(":checked")) {
    // Put your code here if checkbox is checked
}

O puedes usar este también

if($("#checkSurfaceEnvironment-1").prop('checked') == true){
    // Put your code here if checkbox is checked
}

Espero que esto sea útil para ti.

Aquí está la forma más sencilla dada

 <script type="text/javascript">

        $(document).ready(function () {
            $("#chk_selall").change("click", function () {

                if (this.checked)
                {
                    //do something
                }
                if (!this.checked)
                {
                    //do something

                }

            });

        });

    </script>

¡Usé esto y funcionó para mí!

$("checkbox selector").click(function() {
    if($(this).prop('checked')==true){
       do what you need!
    }
});

Sé que esto ya ha sido respondido, pero aún así, esta es una buena manera de hacerlo:

if ($("#checkbox").is(":checked")==false) {
    //Do stuff here like: $(".span").html("<span>Lorem</span>");
}

if($("#checkbox1").prop('checked') == false){
    alert('checkbox is not checked');
    //do something
}
else
{ 
    alert('checkbox is checked');
}

$("#chkFruits_0,#chkFruits_1,#chkFruits_2,#chkFruits_3,#chkFruits_4").change(function () {
        var item = $("#chkFruits_0,#chkFruits_1,#chkFruits_2,#chkFruits_3,#chkFruits_4");
    if (item.is(":checked")==true) {
        //execute your code here
    }

    else if (item.is(":not(:checked)"))
    {
        //execute your code here
    }

});