Cómo establecer el valor de un campo de entrada oculto a través de JavaScript?
Al crear un formulario o un cuestionario, puede haber un requisito para asignar un valor de entrada de usuario a un campo específico. Por ejemplo, agregar entradas confidenciales, yo.mi., una contraseña o un valor codificado para utilizarlos. En tales casos, establecer el valor de un elemento de entrada oculto a través de JavaScript ayuda a mantener los datos seguros y seguros.
Este blog discutirá el procedimiento para establecer el valor de un campo de entrada oculto a través de JavaScript
Cómo establecer el valor de un campo de entrada oculto a través de JavaScript?
Para establecer el valor del campo de entrada oculta a través de JavaScript, aplique los enfoques declarados a continuación:
- "innerhtml" propiedad.
- "jQuery"
Método 1: Establezca el valor del elemento oculto a través de la propiedad innerhtml
El "innerhtml"La propiedad devuelve el contenido HTML del elemento. Esta propiedad se puede utilizar para establecer y agregar el valor definido por el usuario al campo de entrada oculto asignado.
Sintaxis:
elemento.innerhtml = texto
En la sintaxis anterior, "elemento"Se refiere al elemento que debe agregarse con el"texto" valor.
Ejemplo
Pasemos por el ejemplo declarado a continuación:
En el bloque de código anterior:
- En primer lugar, cree el campo de entrada que tiene los atributos establecidos.
- El "tipo"Atributo con el valor"oculto"Significa que es un campo oculto.
- Después de eso, el "inmediato"El cuadro de diálogo toma un valor del usuario.
- Ahora, aplique un cheque sobre el valor definido por el usuario de modo que no lo sea "nulo" utilizando el "si" condición.
- Por último, acceda al campo de entrada oculta por su "identificación" utilizando el "getElementById ()Método "y establecer el valor definido por el usuario a través del"innerhtml" propiedad.
- Finalmente, muestre el valor agregado a través de una alerta.
Producción
Como se observó, el valor de entrada de usuario se agrega al campo de entrada oculta.
Método 2: Establezca el valor del elemento oculto utilizando el enfoque jQuery
En este enfoque, JQuery's "val ()El método se utilizará para asignar el valor del campo de texto de entrada visible al campo de entrada oculta.
Ejemplo
Vamos a ver el siguiente código:
Ingrese el valor para el elemento oculto
En las líneas de código anteriores:
- En primer lugar, incluya un campo de texto de entrada que tenga los atributos establecidos.
- Del mismo modo, asigne otro campo de entrada oculto, como es evidente a partir de su "tipo" atributo.
- La etiqueta agregada tiene un específico "identificación" atributo.
- Después de eso, incluya la biblioteca jQuery con la ayuda del "SRC"Atributo en el"" etiqueta.
- En el código JS, acceda al botón creado y asocie el "en()"Método con él para ejecutar la función en el botón Haga clic.
- En la definición de la función, acceda a la entrada visible "texto"Campo y obtenga su valor usando el"val ()" método.
- En el siguiente paso, el valor recuperado se asignará a la entrada oculta "texto"Campo a través del"val ()" método.
- Finalmente, muestre el valor resultante asignado al "campo de entrada oculto"A través de una alerta.
Producción
En la salida anterior, se puede ver que el valor de la entrada visible "texto"El campo se asigna al"oculto" campo de entrada.
Conclusión
Para establecer el valor de un campo de entrada oculto a través de JavaScript, aplique el "innerhtml"Propiedad o jQuery"val ()" método. La propiedad innerHTML se puede utilizar para aplicar la funcionalidad deseada agregando el valor definido por el usuario. El método val () se puede aplicar para asignar el valor del campo de texto de entrada visible al campo de entrada oculta Este blog discutió el procedimiento para establecer el valor de un campo de entrada oculto a través de JavaScript.