Javascript para comprobar si una casilla de verificación está marcada o no

Question

Tengo una rutina de javascript que está realizando acciones en un grupo de casillas de verificación, pero la acción final que quiero establecer marca o no la casilla marcada si el usuario marcando la casilla o desmarcando.

Desafortunadamente, cada vez que verifico si está marcada o no, vuelve a aparecer, lo que indica que el usuario siempre está marcando la casilla. Cualquier ayuda sería apreciada, también he incluido el javascript.

// Uncheck all the checkboxs with the same Tax Credit 
for (i=0; i<arrChecks.length; i++) 
{ 
    var attribute = arrChecks[i].getAttribute("xid") 
    if (attribute == elementName) 
    { 
     // if the current state is checked, unchecked and vice-versa 
     if (arrChecks[i].value == "on") // <-- This is always returning true, even if the box is being unchecked 
     { 
      arrChecks[i].checked = 1; 
     } else { 
      arrChecks[i].checked = 0; 
     } 

    } else { 
     arrChecks[i].checked = 0; 
    } 
} 

Answer 1

Debe estar evaluando la propiedad marcada del elemento casilla de verificación.

for (i=0; i<arrChecks.length; i++) 
{ 
    var attribute = arrChecks[i].getAttribute("xid") 
    if (attribute == elementName) 
    { 
     // if the current state is checked, unchecked and vice-versa 
     if (arrChecks[i].checked) 
     { 
      arrChecks[i].checked = false; 
     } else { 
      arrChecks[i].checked = true; 
     } 

    } else { 
     arrChecks[i].checked = false; 
    } 
} 

Answer 2

El atributo value de un checkbox es lo que se propuso por:

<input type='checkbox' name='test' value='1'> 

Así que cuando alguien comprueba que la caja, el servidor recibe una variable llamada test con un value de 1 - lo que quiere verificar no es el value de él (que nunca cambiará, si está marcado o no) sino el estado checked de la casilla de verificación.

Por lo tanto, si se reemplaza este código:

if (arrChecks[i].value == "on") 
{ 
    arrChecks[i].checked = 1; 
} else { 
    arrChecks[i].checked = 0; 
} 

Con esta:

arrChecks[i].checked = !arrChecks[i].checked; 

Se debe trabajar. Debe usar true y false en lugar de 0 y 1 para esto.

Answer 3

No estoy seguro de cuál es el problema, pero estoy bastante seguro de que esto lo solucionará.

for (i=0; i<arrChecks.length; i++) 
    { 
     var attribute = arrChecks[i].getAttribute("xid") 
     if (attribute == elementName) 
     { 
      if (arrChecks[i].checked == 0) 
      { 
       arrChecks[i].checked = 1; 
      } else { 
       arrChecks[i].checked = 0; 
      } 

     } else { 
      arrChecks[i].checked = 0; 
     } 
    } 

Answer 4

También asegúrese de probarlo tanto en Firefox como en IE. Hay algunos errores desagradables con casillas manipuladas JS.

Answer 5

Para alternar una casilla de verificación o puede utilizar

element.checked = !element.checked; 

lo que podría utilizar

if (attribute == elementName) 
{ 
    arrChecks[i].checked = !arrChecks[i].checked; 
} else { 
    arrChecks[i].checked = false; 
} 

Answer 6

function enter_comment(super_id) { 
    if (!(document.getElementById(super_id).checked)) { 
     alert('selected checkbox is unchecked now') 
    } else { 
     alert('selected checkbox is checked now'); 
    } 
} 

<input type="checkbox" name="a" id="1" value="1" onclick="enter_comment(this.value)" />

<input type="checkbox" name="b" id="2" value="2" onclick="enter_comment(this.value)" />

Answer 7

function CHeck(){ 
    var ChkBox = document.getElementById("CheckBox1"); 
    alert(ChkBox.Checked); 
} 

<asp:CheckBox ID="CheckBox1" runat="server" onclick="CHeck()" />