jQuery Show-Hide DIV basado en el valor de casilla de verificación

Question

Uso de AJAX Relleno un DIV con un montón de casillas de verificación (cada una con su propia identificación única). Los ID son "projectID1", "projectID2", "projectID3" y así sucesivamente ... He dado a todas las casillas de verificación una clase de "pChk".

Mi objetivo final es mostrar el DIV que contiene el botón Enviar si CUALQUIERA de las casillas de verificación están marcadas. La única vez que se oculta el DIV que contiene el botón Enviar es si todas las casillas de verificación están desmarcadas.

Sin embargo, el código que he presentado a continuación muestra/oculta el botón de envío DIV para cada instancia de casilla de verificación. En otras palabras, si tengo tres casillas de verificación CHECKED y DESHECHO una de ellas, el botón Submit DIV se oculta.

¡Su asesoramiento de expertos es más que bienvenido!

function checkUncheck() { 
    $('.pChk').click(function() { 
     if (this.checked) { 
      $("#ProjectListButton").show(); 
     } else { 
      $("#ProjectListButton").hide(); 
     } 
    }); 
} 

Answer 1

Esto es porque solo está marcando la casilla actual.

cambiarlo a

function checkUncheck() { 
    $('.pChk').click(function() { 
     if ($('.pChk:checked').length > 0) { 
      $("#ProjectListButton").show(); 
     } else { 
      $("#ProjectListButton").hide(); 
     } 
    }); 
} 

para comprobar si no se marca ninguna de las casillas de verificación (un montón de cheques en esta línea ..).

referencia: http://api.jquery.com/checked-selector/

Answer 2

Se podría considerar el uso de la :checked selector, proporcionado por jQuery. Algo como esto:

$('.pChk').click(function() { 
    if($('.pChk:checked').length > 0) { 
     $("#ProjectListButton").show(); 
    } else { 
     $("#ProjectListButton").hide(); 
    } 
}); 

Answer 3

Si bien esto es viejo si alguien se encuentra con esto de nuevo (a través de la búsqueda). La respuesta correcta con jQuery 1.7 en adelante es ahora:

$('.pChk').click(function() { 
    if($(this).is(':checked')) { 
     $("#ProjectListButton").show(); 
    } else { 
     $("#ProjectListButton").hide(); 
    } 
}); 

Answer 4

ebdiv se establece style="display:none;"

se obras muestran & ocultar

$(document).ready(function(){ 
    $("#eb").click(function(){ 
     $("#ebdiv").toggle(); 
    }); 

}); 

Answer 5

utilizo jQuery apuntalar

$('#yourCheckbox').change(function(){ 
    if($(this).prop("checked")) { 
    $('#showDiv').show(); 
    } else { 
    $('#hideDiv').hide(); 
    } 
}); 

Answer 6

Try

$('.yourchkboxes').change(function(){ 
    $('.yourbutton').toggle($('.yourchkboxes:checked').length > 0); 
}); 

Por lo tanto, se comprobará que al menos una casilla esté marcada o no.

Answer 7

Un consejo para todas las personas que usan el complemento plano-rojo, plano y verde, ¡debido a este complemento las respuestas anteriores no funcionarán!

En ese caso, use onchange = "do_your_stuff();" en la etiqueta, por ejemplo: Su casilla de verificación aquí

La razón por la que no funciona es que este Jquery crea una gran cantidad de objetos alrededor de la casilla de verificación real, por lo que no puede ver si ha cambiado o no.

Pero si alguien haga clic en la casilla de verificación recta, no va a funcionar: '(