¿Hay alguna manera de ocultar las casillas de verificación que no están marcadas? Tengo tres casillas de verificación y estoy buscando una forma de ocultar las que no están marcadas. El código que tengo ahora oculta todas las casillas de verificación y estoy tratando de ocultar las que no están marcadas.
Este es mi código:
$('input[type=checkbox]').each(function () { //Check if the box is checked var x = $(this).is(':checked'); //if checkbox is NOT checked if(x === false) { //Hide the choice $(this).parent().hide(); } }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <input type="checkbox" name="testing" value="B">A</label><br /> <input type="checkbox" name="testing" value="I">B</label><br /> <input type="checkbox" name="testing" value="A">C</label><br />@ 5alidshammout tiene razón. Necesita un evento de cambio y si desea mostrar todo nuevamente al desmarcar esa casilla, simplemente puede usar la instrucción if. También faltaban etiquetas iniciales para <label> en su código.
$('input[type=checkbox]').on('change', function() { if ($(this).is(':checked')) { $('input[type=checkbox]').each(function() { //Check if the box is checked var x = $(this).is(':checked'); //if checkbox is NOT checked if(x === false) { //Hide the choice $(this).parent().hide(); } }); } else { $('input[type=checkbox]').parent().show(); } }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <label><input type="checkbox" name="testing" value="B">A</label><br /> <label><input type="checkbox" name="testing" value="I">B</label><br /> <label><input type="checkbox" name="testing" value="A">C</label><br />Puede verificar si una casilla de verificación está marcada o no con esto:
if (document.getElementById('testing').checked) { //something }Puedes probar esto,
// Hide the choice $(this).hide();En vez de,
// Hide the choice $(this).parent().hide();