Este artículo demostrará los métodos para marcar y desmarcar todas las casillas de verificación usando JavaScript.
¿Cómo marcar y desmarcar todas las casillas de verificación usando JavaScript?
Para marcar y desmarcar todas las casillas de verificación en JavaScript, puede aplicar:
- “ documento.getElementsByName ” método con casillas de verificación
- “ documento.getElementsByName ” método con botones
¡Los enfoques mencionados ahora se discutirán uno por uno!
Método 1: marque y desmarque todas las casillas de verificación en JavaScript utilizando el método 'document.getElementsByName ()' con 'casillas de verificación'
Los ' documento.getElementsByName() El método devuelve los elementos con el nombre especificado en sus argumentos. Este método se aplicará para obtener el valor de cada casilla de verificación con la ayuda del nombre pasado.
Veamos el siguiente ejemplo para demostración.
Ejemplo
Primero, el tipo de entrada se especificará como “ caja ” y se asignará un nombre y valor específico a cada casilla de verificación:
< tipo de entrada = 'caja' nombre = 'sólo' valor = 'Pitón' > Pitón < hermano />< tipo de entrada = 'caja' nombre = 'sólo' valor = 'Java' > Java < hermano />
< tipo de entrada = 'caja' nombre = 'sólo' valor = 'JavaScript' > JavaScript < hermano />
Ahora, incluya una casilla de verificación adicional con el valor ' Comprobar todo ” y adjunte un “ al hacer clic() ” evento con esta casilla de verificación que funcionará de tal manera cuando se haga clic en la casilla de verificación, el “ marcarDesmarcado ()” se invocará con el objeto “ este ” como argumento:
< tipo de entrada = 'caja' al hacer clic = 'marcarDesmarcar(esto)' /> Comprobar todo < hermano />
Después de eso, defina una función llamada “ marcarDesmarcar() ” en el archivo JavaScript, con una variable llamada “ caja como argumento. Ahora, acceda a los valores de la casilla de verificación usando el ' documento.getElementsByName() ” método y coloque el valor de la “ nombre ” atributo como su argumento.
Por último, aplica un “ por ” para iterar a lo largo de todos los valores de las casillas de verificación y utilizar el “ comprobado ” propiedad para marcarlos a todos como marcados:
verificación de funcionesDesmarcar ( caja ) {obtener = documento. getElementsByName ( 'sólo' ) ;
por ( estaba en = 0 ; i < obtener. longitud ; i ++ ) {
obtener [ i ] . comprobado = caja. comprobado ; }
}
Como puede ver, cuando el “ Comprobar todo La casilla de verificación está marcada, todas las demás casillas de verificación también están marcadas como marcadas:
Método 2: marque y desmarque todas las casillas de verificación en JavaScript usando el método 'document.getElementsByName()' con 'Botones'
Los ' documento.getElementsByName() El método, como se discutió en el método anterior, obtiene los elementos con el nombre especificado en sus argumentos. Se puede utilizar para marcar o desmarcar todas las casillas de verificación agregadas en una página web.
Mire el siguiente ejemplo para la demostración.
Ejemplo
Ahora, incluiremos dos botones tanto para el “ Verifica todo ' y ' Desmarcar todo ” funcionalidades. Luego, adjunte un “ al hacer clic ” evento con ambos botones que accederá a las funciones especificadas por separado:
< tipo de entrada = 'botón' al hacer clic = 'controlar()' valor = 'Comprueba todo' />< tipo de entrada = 'botón' al hacer clic = 'desmarcar()' valor = 'Desmarca todo' />
A continuación, defina una función llamada “ controlar() ” y aplicar el “ documento.getElementsByName ” método con el valor especificado de la “ nombre ' atributo. Luego, iterar el ' por ” recorre todos los valores de las casillas discutidos en el método anterior.
Además, cuando se hace clic en el botón asociado, el “ comprobado La propiedad 'marcará todas las casillas de verificación y establecerá el estado marcado como' verdadero ”:
control de funcionamiento ( ) {ser cabra = documento. getElementsByName ( 'controlar' ) ;
por ( estaba en = 0 ; i < obtener. longitud ; i ++ ) {
obtener [ i ] . comprobado = verdadero ; }
}
A continuación, defina una función llamada “ desmarcar() ', y agregue la funcionalidad inversa en él para marcar la propiedad de la casilla marcada como ' falso ”:
función desmarcar ( ) {ser cabra = documento. getElementsByName ( 'controlar' ) ;
por ( estaba en = 0 ; i < obtener. longitud ; i ++ ) {
obtener [ i ] . comprobado = falso ; }
}
Puede ver en la salida que los botones agregados funcionan perfectamente:
Hemos proporcionado los métodos más fáciles para marcar y desmarcar todas las casillas de verificación usando JavaScript.
Conclusión
Para marcar y desmarcar todas las casillas de verificación usando JavaScript, use el ' documento.getElementsByName() ” método con “ Casillas de verificación ' para agregar una casilla de verificación y acceder a la función, lo que resultará en marcar las casillas de verificación o aplicar el mismo método con ' Botones ” para incluir dos botones por separado para marcar y desmarcar todos los valores especificados. Este artículo explica los métodos para marcar y desmarcar todas las casillas de verificación usando JavaScript.