Este artículo ilustra el propósito, el funcionamiento y el uso de la propiedad 'deshabilitada' de la casilla de verificación de entrada HTML DOM en JavaScript.
¿Cómo funciona la propiedad 'deshabilitada' de la casilla de verificación de entrada HTML DOM en JavaScript?
La casilla de verificación de entrada “ desactivado La propiedad ” depende del atributo “casilla de verificación”. Funciona en los formularios HTML y campos de entrada para deshabilitar y deshabilitar las casillas de verificación dadas.
Sintaxis (establecer la propiedad deshabilitada)
objeto de casilla de verificación. desactivado = verdadero | FALSODe acuerdo con la sintaxis de devolución definida, la propiedad 'deshabilitada' admite dos parámetros que se enumeran a continuación:
- verdadero: Representa que el checkbox correspondiente está deshabilitado.
- falso (valor predeterminado): Es un valor opcional que indica que la casilla de verificación asociada no está deshabilitada.
Devolver (Devolver la Propiedad inhabilitada)
objeto de casilla de verificación. desactivadoEn la sintaxis anterior, el ' objeto de casilla de verificación ” corresponde al HTML “ caja ' elemento.
Utilicemos las sintaxis definidas anteriormente en los siguientes ejemplos para comprender la implementación práctica de la propiedad 'deshabilitada'.
Ejemplo 1: aplicación de la propiedad 'deshabilitada' de la casilla de verificación de entrada Uso de la sintaxis básica
En el primer ejemplo, se agrega la 'casilla de verificación' para deshabilitarla utilizando la sintaxis generalizada definida.
código HTML
En primer lugar, analice el código HTML dado:
< tipo de cuerpo = 'alinear texto: centro' >
< h2 > HTML Entrada DOM Caja Propiedad deshabilitada en JavaScript h2 >
Caja : < tipo de entrada = 'caja' identificación = 'manifestación' > Formulario enviado < hermano >< hermano >
< pag > La casilla de verificación dada está deshabilitada pag >
En las líneas de código anteriores:
- El '
La etiqueta ” especifica la sección del cuerpo que está alineada con el “ centro ” con la ayuda del “ estilo ' atributo. - El ' La etiqueta ” define el subtítulo del nivel 2.
- El '
La etiqueta ” crea una “casilla de verificación” especificando el tipo de entrada “ caja 'tener una identificación asignada' manifestación ”. - El ' La etiqueta ” agrega un elemento de párrafo para mostrar el resultado resultante.
Código JavaScript
A continuación, mira el código JavaScript:
< guion >documento. getElementById ( 'manifestación' ) . desactivado = verdadero ;
guion >
En el fragmento de código anterior, el ' documento.getElementById() Se aplica el método 'para obtener la casilla de verificación usando su id 'demo' y el valor de la propiedad 'deshabilitado' se establece en ' verdadero ” que deshabilita la casilla de verificación.
Producción
El resultado anterior confirma que la casilla de verificación dada está deshabilitada debido a ' desactivado ” propiedad establecida en “ verdadero ”.
Ejemplo 2: devolver el valor de propiedad 'deshabilitado' de la casilla de verificación de entrada
Este ejemplo aplica la propiedad 'deshabilitada' para devolver el estado de la casilla de verificación objetivo como un valor booleano (verdadero/falso).
código HTML
Considere el siguiente código HTML:
< tipo de cuerpo = 'alinear texto: centro' >< h2 > HTML Entrada DOM Caja Propiedad deshabilitada en JavaScript h2 >
Caja : < tipo de entrada = 'caja' desactivado = verdadero identificación = 'manifestación' > Formulario enviado < hermano >< hermano >
< identificación p = 'muestra' > pag >
En el bloque de código anterior:
- Se asigna la casilla de verificación y el estado de la “ desactivado La propiedad ” se establece en “ verdadero ”.
- Después de eso, un vacío ' El elemento ” se agrega con una identificación asignada “muestra” para agregar la salida.
Código JavaScript
Ahora, pase al código JavaScript:
< guion >hay un = documento. getElementById ( 'manifestación' ) . desactivado ;
documento. getElementById ( 'muestra' ) . HTML interno = a ;
guion >
En el código anterior:
- La variable ' a ” utiliza el “ documento.getElementById() ” para acceder a la casilla de verificación usando su id “demo” y asociar el “ desactivado ” para verificar si la casilla de verificación recuperada está deshabilitada o no.
- El método 'document.getElementById()' aplicado nuevamente obtiene el párrafo vacío incluido y muestra el estado de la propiedad 'deshabilitada' como un párrafo.
Producción
Tal como se analizó, el resultado devuelve el estado asignado de 'casilla de verificación', es decir, ' verdadero ”.
Ejemplo 3: deshabilite y deshabilite la casilla de verificación usando la propiedad 'deshabilitada' de la casilla de verificación de entrada
Además de configurar y devolver el estado de la casilla de verificación, la propiedad 'deshabilitada' también permite a los usuarios deshabilitar y deshabilitar la casilla de verificación al mismo tiempo. Veámoslo de forma práctica.
código HTML
Repasemos el código HTML escrito:
< tipo de cuerpo = 'alinear texto: centro' >< h2 > HTML Entrada DOM Caja Propiedad deshabilitada en JavaScript h2 >
Caja : < tipo de entrada = 'caja' identificación = 'manifestación' > Formulario enviado aporte >< hermano >< hermano >
< botón al hacer clic = 'verificar Deshabilitar ()' > Deshabilitar la casilla de verificación botón >
< botón al hacer clic = 'verificar Deshabilitar ()' > Deshabilitar la casilla de verificación botón >
En el bloque de código anterior:
- Del mismo modo, incluya una casilla de verificación y agregue un botón que tenga un ' al hacer clic ” evento que ejecuta el “ verificar Deshabilitar () ” función al hacer clic en el botón.
- Después de eso, se agrega el segundo botón que también usa el controlador de eventos 'onclick' para la ejecución del ' comprobar Undisable() ” cuando se hace clic en el botón.
Código JavaScript
A continuación, vaya a través del código indicado a continuación:
< guion >verificación de función Deshabilitar ( ) {
documento. getElementById ( 'manifestación' ) . desactivado = verdadero ;
}
verificación de función Deshabilitar ( ) {
documento. getElementById ( 'manifestación' ) . desactivado = FALSO ;
}
guion >
En las líneas de código anteriores:
- Defina una función llamada “ verificar Deshabilitar () ” que aplica el “ documento.getElementById() ” para acercarse a la casilla de verificación a través de su id “demo” y establecer su valor en “verdadero”.
- La segunda función “ comprobar Undisable() ” vuelve a aplicar el método “document.getElementById()” para acceder a la casilla de verificación nuevamente y establecer su valor en “falso” si el usuario hace clic en el segundo botón incluido llamado “Deshabilitar la casilla de verificación”.
Producción
La salida 'deshabilita' la casilla de verificación dada cuando el usuario hace clic en el primer botón y la 'deshabilita' si el usuario hace clic en el segundo botón en consecuencia.
Conclusión
En JavaScript, la casilla de verificación de entrada HTML DOM “ desactivado La propiedad ” ayuda a los usuarios a establecer y devolver el estado marcado de la “casilla de verificación”. Define las sintaxis generalizadas para los procesos de 'establecimiento' y 'retorno'. Su sintaxis establecida funciona en dos valores “ verdadero ' y ' FALSO ”. Por otro lado, su sintaxis de retorno no requiere ningún parámetro. Este artículo demostró la implementación objetiva, funcional y práctica de la propiedad 'deshabilitada' de la casilla de verificación de entrada HTML DOM en JavaScript.