Como definir o valor de um campo de entrada oculto através do JavaScript?

Ao criar um formulário ou um questionário, pode haver um requisito para alocar um valor de entrada do usuário para um campo específico. Por exemplo, anexando entradas confidenciais, eu.e., uma senha ou um valor codificado para utilizá -los. Nesses casos, definir o valor de um elemento de entrada oculto através do JavaScript auxilia a manter os dados seguros.

Este blog discutirá o procedimento para definir o valor de um campo de entrada oculto através do JavaScript

Como definir o valor de um campo de entrada oculto através do JavaScript?

Para definir o valor do campo de entrada oculto por meio do JavaScript, aplique as abordagens abaixo estatadas:

• ““Innerhtml" propriedade.
• ““jQuery”

Método 1: Defina o valor do elemento oculto via propriedade innerhtml

O "Innerhtml”Propriedade retorna o conteúdo HTML do elemento. Esta propriedade pode ser utilizada para definir e anexar o valor definido pelo usuário ao campo de entrada oculto alocado.

Sintaxe:

elemento.INNERHTML = Texto

Na sintaxe acima, “elemento”Refere -se ao elemento que precisa ser anexado ao“texto" valor.

Exemplo

Vamos passar pelo exemplo abaixo do ponto:

No bloco de código acima:

• Em primeiro lugar, crie o campo de entrada com os atributos declarados.
• O "tipo”Atributo com o valor“escondido”Significa que é um campo oculto.
• Depois disso, o “incitar”A caixa de diálogo leva um valor do usuário.
• Agora, aplique um cheque no valor definido pelo usuário de forma que não seja “nulo”Usando o“se" doença.
• Por fim, acesse o campo de entrada oculto por seu “eu ia”Usando o“getElementById ()”Método e defina o valor definido pelo usuário por meio do“Innerhtml" propriedade.
• Finalmente, exiba o valor anexado por meio de um alerta.

Saída

Como observado, o valor da entrada do usuário é anexado ao campo de entrada oculto.

Método 2: Defina o valor do elemento oculto usando a abordagem jQuery

Nesta abordagem, JQuery's “val ()”O método será utilizado para alocar o valor do campo de texto de entrada visível para o campo de entrada oculto.

Exemplo

Vamos ver o seguinte código:

Digite o valor para o elemento oculto

Enviar

Nas linhas acima do código:

• Em primeiro lugar, inclua um campo de texto de entrada com os atributos declarados.
• Da mesma forma, aloque outro campo de entrada oculto, como evidente em seu “tipo”Atributo.
• Tag adicionado com um específico "eu ia”Atributo.
• Depois disso, inclua a biblioteca jQuery com a ajuda do “srcAtributo no “" marcação.
• No código JS, acesse o botão criado e associe o “sobre()”Método para executar a função no botão Clique.
• Na definição da função, acesse a entrada visível “texto”Campo e buscar seu valor usando o“val ()”Método.
• Na próxima etapa, o valor buscado será alocado para a entrada oculta “texto“Campo através do“val ()”Método.
• Finalmente, exiba o valor resultante alocado para o “campo de entrada oculto”Através de um alerta.

Saída

Na saída acima, pode -se observar que o valor da entrada visível “texto”O campo é alocado para o“escondido" campo de entrada.

Conclusão

Para definir o valor de um campo de entrada oculto através do JavaScript, aplique o “Innerhtml”Propriedade ou o jQuery“val ()”Método. A propriedade InnerHTML pode ser usada para aplicar a funcionalidade desejada, anexando o valor definido pelo usuário. O método Val () pode ser aplicado para alocar o valor do campo de texto de entrada visível no campo de entrada oculto, este blog discutiu o procedimento para definir o valor de um campo de entrada oculto através do JavaScript.