: o elemento Input (Form Input)

accept

Válido apenas para o tipo de entrada file, o atributo accept define quais tipos de arquivo são selecionáveis em um file controle de upload. Veja o tipo de entrada do arquivo.

alt

Válido apenas para o botão image, o fornece um texto alternativo para a imagem, exibindo o valor do atributo se a imagem src estiver ausente ou falhar ao carregar. Veja o tipo de entrada da imagem.

autocomplete

(Não é um atributo booleano!) O atributo autocomplete assume como seu valor uma string separada por espaço que descreve qual, se houver, tipo de funcionalidade de preenchimento automático a entrada deve fornecer. Uma implementação típica de autocompletar recupera valores anteriores inseridos no mesmo campo de entrada, mas podem existir formas mais complexas de autocompletar. Por exemplo, um navegador pode se integrar à lista de contatos de um dispositivo para preencher automaticamente email endereços em um campo de entrada de e-mail. Consulte Valores no atributo HTML autocomplete para obter os valores permitidos.

O atributo autocomplete é válido em hidden, text, search, url, tel, email, date, month, week, time, datetime-local, number, range, color e password. Este atributo não tem efeito em tipos de entrada que não retornam dados numéricos ou de texto, sendo válido para todos os tipos de entrada, exceto checkbox, radio, file ou qualquer um dos tipos de botão.

Veja o atributo de preenchimento automático HTML f ou informações adicionais, incluindo informações sobre segurança de senha e como autocomplete é ligeiramente diferente para hidden do que para outros tipos de entrada.

autofocus

Um atributo booleano que, se presente, indica que a entrada deve ter foco automaticamente quando a página terminar de carregar (ou quando <dialog> contendo o elemento foi exibido).

Observação: um elemento com o atributo autofocus pode ganhar foco antes do DOMContentLoaded o evento é disparado.

Não mais do que um elemento no documento pode ter o atributo autofocus. Se colocado em mais de um elemento, o primeiro com o atributo recebe o foco.

O atributo autofocus não pode ser usado em entradas do tipo hidden, uma vez que entradas ocultas não podem ser focadas.

Aviso: Focar automaticamente um controle de formulário pode confundir pessoas com deficiência visual que usam a tecnologia de leitura de tela e pessoas com deficiências cognitivas. Quando autofocus é atribuído, os leitores de tela “teletransportam” seu usuário para o controle de formulário sem avisá-lo com antecedência.

Considere cuidadosamente a acessibilidade quando aplicando o atributo autofocus. Focar automaticamente em um controle pode fazer com que a página role durante o carregamento. O foco também pode causar a exibição de teclados dinâmicos em alguns dispositivos de toque. Enquanto um leitor de tela anunciará o rótulo do controle de formulário que recebe o foco, o leitor de tela não anunciará nada antes do rótulo, e o usuário com visão em um pequeno dispositivo perderá igualmente o contexto criado pelo conteúdo anterior.

capture

Introduzido na especificação HTML Media Capture e válido apenas para o file tipo de entrada, o capture define qual mídia – microfone, vídeo ou câmera – deve ser usada para capturar um novo arquivo para upload com file controle de upload em cenários de suporte. Veja o tipo de entrada do arquivo.

checked

Válido para radio e checkbox tipos, checked é um atributo booleano. Se estiver presente em um tipo radio, indica que o botão de opção é o atualmente selecionado no grupo de botões de opção com o mesmo nome. Se estiver presente em um tipo checkbox, indica que a caixa de seleção está marcada por padrão (quando a página é carregada). Não indica se esta caixa de seleção está marcada: se o estado da caixa de seleção for alterado, este atributo de conteúdo não reflete a alteração. (Apenas o HTMLInputElement checked atributo IDL é atualizado.)

Nota: Ao contrário de outros controles de entrada, os valores das caixas de seleção e dos botões de opção só são incluídos nos dados enviados se eles estiverem checked. Se forem, o nome e o (s) valor (es) dos controles marcados são enviados.

Por exemplo, se uma caixa de seleção cujo name é fruit tem um value de cherry, e a caixa de seleção está marcada, os dados do formulário enviados incluirão fruit=cherry. Se a caixa de seleção não estiver ativa, ela não está listada nos dados do formulário. O padrão value para caixas de seleção e botões de opção é on.

dirname

Válido apenas para os tipos de entrada text e search, o dirname atributo permite o envio da direcionalidade do elemento. Quando incluído, o controle de formulário será enviado com dois pares de nome / valor: o primeiro sendo name e value, sendo o segundo o valor do dirname como o nome com o valor de ltr ou rtl sendo definido pelo navegador.

Quando o formulário acima é enviado, a entrada causa o name / value par de fruit=cherry e o dirname / par de direção de fruit.dir=ltr a ser enviado.

disabled

Um atributo booleano que, se presente, indica que o usuário não deve ser capaz de interagir com a entrada. As entradas desativadas são normalmente renderizadas com uma cor mais escura ou usando alguma outra forma de indicação de que o campo não está disponível para uso.

Especificamente, as entradas desativadas não recebem o click evento e entradas desativadas não são enviadas com o formulário.

Observação: embora não seja exigido pela especificação, o Firefox irá, por padrão, persistir o estado dinâmico desativado de um <input> nos carregamentos de página. Use o atributo autocomplete para controlar este recurso.

form

Uma string especificando o <form> elemento com o qual a entrada está associada (ou seja, seu proprietário do formulário). O valor desta string “s, se presente, deve corresponder ao id de um elemento <form> no mesmo documento. Se este atributo não for especificado, o elemento <input> é associado ao formulário contendo mais próximo, se houver.

O atributo form permite coloque uma entrada em qualquer lugar do documento, mas inclua-a em um formulário em outra parte do documento.

Nota: Uma entrada só pode ser associada a um formulário. div id = “d4a3166041”>

Válido apenas para os tipos de entrada image e submit. Consulte o tipo de entrada de envio para obter mais informações.

formenctype

Válido para image e submit apenas tipos de entrada. Consulte o tipo de entrada de envio para obter mais informações.

formmethod

Válido para image e submit apenas tipos de entrada. Consulte o tipo de entrada de envio para obter mais informações.

formnovalidate

Válido para image e submit apenas tipos de entrada. Consulte o tipo de entrada de envio para obter mais informações.

formtarget

Válido para image e submit apenas tipos de entrada. Consulte o tipo de entrada de envio para obter mais informações.

height

Válido apenas para o image botão de entrada, o height é a altura do arquivo de imagem a ser exibido para representar o botão gráfico de envio. Veja o tipo de entrada da imagem.

id

Atributo global válido para todos os elementos, incluindo todos os tipos de entrada, define um identificador único (ID) que deve ser único em todo o documento. Seu objetivo é identificar o elemento ao vincular. O valor é usado como o valor do atributo <label> “s for para vincular o rótulo ao controle de formulário. Consulte <label>.

inputmode

Valor global válido para todos os elementos, fornece uma dica para os navegadores quanto ao tipo de configuração do teclado virtual use ao editar este elemento ou seu conteúdo. Os valores incluem none, text, tel, url, email, numeric, decimal e search.

list

O valor dado ao atributo list deve ser id de um elemento <datalist> localizado no mesmo documento. O <datalist> fornece uma lista de valores predefinidos para sugerir ao usuário para esta entrada. Quaisquer valores na lista que não sejam compatíveis com type não são incluídos nas opções sugeridas. Os valores fornecidos são sugestões, não requisitos: os usuários podem selecionar a partir dessa lista predefinida ou fornecer um valor diferente.

É válido em text, search, url, tel, email, date, month, week, time, datetime-local, number, range e color.

De acordo com as especificações, o atributo list não é compatível com hidden, password, checkbox, radio, file, ou qualquer dos tipos de botão.

Dependendo do navegador, o usuário pode ver uma paleta de cores personalizada sugerida, marcas de tique ao longo de um intervalo ou até mesmo uma entrada que abre como uma <select> mas permite va não listado lues. Verifique a tabela de compatibilidade do navegador para os outros tipos de entrada.

Veja o elemento <datalist>.

max

Válido para date, month, week, time, datetime-local, number e range, define o maior valor na faixa de valores permitidos. Se o value inserido no elemento exceder isso, o elemento falhará na validação de restrição. Se o valor do atributo max não for um número, o elemento não tem valor máximo.

Há um caso especial: se o tipo de dados for periódico (como para datas ou horas), o valor de max pode ser inferior ao valor de min, o que indica que o intervalo pode wrap around; por exemplo, isso permite que você especifique um intervalo de tempo das 22h às 4h.

maxlength

Válido para text, search, url, tel, email e password, define o número máximo de caracteres (como unidades de código UTF-16) que o usuário pode inserir no campo. Deve ser um valor inteiro 0 ou superior. Se nenhum maxlength for especificado ou um valor inválido for especificado, o campo não terá comprimento máximo. Este valor também deve ser maior ou igual ao valor de .

A entrada falhará na validação de restrição se o comprimento do texto inserido no campo for maior que maxlength Unidades de código UTF-16 de comprimento. Por padrão, os navegadores evitam que os usuários insiram mais caracteres do que o permitido pelo atributo maxlength. Consulte a validação do lado do cliente para obter mais informações.

min

Válido para date, month, week, time, datetime-local, number e range, define o valor mais negativo na faixa de valores permitidos. Se o value inserido no elemento for menor que isso, o elemento falhará na validação de restrição. Se o valor do atributo min não for um número, o elemento não tem valor mínimo.

Este valor deve ser menor ou igual ao valor de o atributo max. Se o atributo min estiver presente, mas não for especificado ou for inválido, não min valor é aplicado. Se o atributo min for válido e um valor não vazio for menor que o mínimo permitido pelo min atributo, a validação de restrição impedirá o envio do formulário. Consulte Validação do lado do cliente para obter mais informações.

Há um caso especial: se o tipo de dados for periódico (como para datas ou horas), o valor de max pode ser menor que o valor de min, o que indica que o intervalo pode envolver; por exemplo, isso permite que você especifique um horário variam das 22h às 4h.

minlength

Válido para text, search, url, tel, email e password, ele define o número mínimo de caracteres (como unidades de código UTF-16) que o usuário pode inserir no campo de entrada. Deve ser um valor inteiro não negativo menor ou igual ao valor especificado por maxlength. Se nenhum minlength for especificado, ou um valor inválido for especificado, a entrada não terá comprimento mínimo.

A entrada falhará na validação de restrição se o comprimento do texto inseridos no campo têm menos de minlength unidades de código UTF-16, impedindo o envio do formulário. Consulte a validação do lado do cliente para obter mais informações.

multiple

O atributo booleano multiple, se definido, significa o usuário pode inserir endereços de e-mail separados por vírgula no widget de e-mail ou pode escolher mais de um arquivo com a entrada file. Veja o e-mail e o tipo de entrada do arquivo.

name

Uma string que especifica um nome para o controle de entrada. Este nome é enviado junto com o valor do controle quando os dados do formulário são enviados.

O que há em um nome

Considere o name um atributo obrigatório (mesmo que não seja). Se uma entrada não tiver name especificado, ou name estiver vazio, o O valor de entrada não é enviado com o formulário! (Controles desativados, botões de opção desmarcados, caixas de seleção desmarcadas e botões de redefinição também não são enviados.)

Existem dois casos especiais:

  1. _charset_: Se usado como o nome de um elemento <input> do tipo oculto, a entrada “s value é automaticamente definida por o agente do usuário para a codificação de caracteres usada para enviar o formulário.
  2. isindex: Por motivos históricos, o nome isindex não é permitido.
nome e botões de opção

O atributo name cria um comportamento único para botões de opção.

Apenas um botão de opção em um grupo de botões de opção com o mesmo nome pode ser verificado por vez. A seleção de qualquer botão de opção nesse grupo desmarca automaticamente qualquer botão de opção atualmente selecionado no mesmo grupo. O valor de aquele botão de opção selecionado é enviado junto com o nome se o formulário for enviado,

Ao acessar uma série de -grupo nomeado de botões de rádio, se um estiver marcado, esse receberá o foco. Se eles não estiverem agrupados na ordem de origem, se um dos grupos estiver marcado, a tabulação no grupo começa quando o primeiro do grupo é encontrado, pulando todos aqueles que não estão marcados. Em outras palavras, se um estiver marcado, a tabulação ignora os botões de opção desmarcados no grupo. Se nenhum estiver marcado, o grupo de botões de opção recebe o foco quando o primeiro botão no mesmo grupo de nome é alcançado.

Assim que um dos botões de opção em um grupo estiver em foco, usar as teclas de seta para navegar por todos os botões de opção com o mesmo nome, mesmo se os botões de opção não estiverem agrupados na ordem de origem.

HTMLFormElement.elements

Quando um elemento de entrada recebe um name, esse nome se torna uma propriedade do elemento de formulário proprietário “s HTMLFormElement.elements propriedade. Se você tiver uma entrada cuja name é definido como guest e outro cujo name é hat-size, o código a seguir pode ser usado:

Quando este código for executado, guestName será o HTMLInputElement para o campo guest e hatSize o objeto para hat-size campo.

Aviso: Evite dar aos elementos do formulário um name que corresponda a uma propriedade embutida do formulário, uma vez que você então sobrescreveria a propriedade ou método predefinido com esta referência à entrada correspondente.

pattern

O atributo pattern, quando especificado, é uma expressão regular que o input “s value deve corresponder para que o valor passe na validação da restrição. Deve ser uma expressão regular JavaScript válida, conforme usada pelo tipo RegExp, e conforme documentado em nosso guia sobre expressões regulares; o sinalizador "u" é especificado ao compilar a expressão regular, para que o padrão seja tratado como uma sequência de pontos de código Unicode, em vez de ASCII. Nenhuma barra deve ser especificada ao redor do texto padrão.

Se o atributo pattern estiver presente, mas não for especificado ou for inválido, nenhuma expressão regular será aplicada e isso atributo é ignorado completamente.Se o atributo padrão for válido e um valor não vazio não corresponder ao padrão, a validação de restrição impedirá o envio do formulário.

Dica: se estiver usando pattern, informe o usuário sobre o formato esperado, incluindo texto explicativo nas proximidades. Você também pode incluir um atributo title para explicar quais são os requisitos para corresponder ao padrão; a maioria dos navegadores exibirá este título como uma dica de ferramenta. A explicação visível é necessária para acessibilidade. A dica de ferramenta é um aprimoramento.

Consulte a validação do lado do cliente para obter mais informações.

placeholder

O placeholder O atributo é uma string que fornece uma breve dica ao usuário quanto ao tipo de informação esperado no campo. Deve ser uma palavra ou frase curta que forneça uma dica quanto ao tipo de dados esperado, ao invés de uma explicação ou prompt. O texto não deve incluir retornos de carro ou avanços de linha. Portanto, por exemplo, se um campo deve capturar o primeiro nome de um usuário e seu rótulo for “Nome”, um marcador adequado pode ser “por exemplo, Mustafa “.

Observação: o atributo placeholder não é tão semanticamente útil quanto outras maneiras de explicar seu formulário e pode causar problemas técnicos inesperados com o seu conteúdo. Consulte os rótulos em < input >: O elemento Input (Form Input) para obter mais informações.

readonly

Um atributo booleano que, se presente, indica que o usuário não deve ser capaz de editar o valor da entrada. O readonly atributo é compatível text, search, url, tel, email, date, month, week, time, datetime-local, number e password tipos de entrada.

Consulte o atributo HTML: readonly para obter mais informações.

required é um atributo booleano que, se presente, indica que o usuário deve especificar um valor para a entrada antes que o formulário proprietário possa ser enviado. O atributo required é compatível com text, search, url, tel, email, date, month, week, time, datetime-local, number, password, checkbox, radio, e file entradas.

Consulte a validação do lado do cliente e o atributo HTML: required para obter mais informações.

sizeVálido paraemail,password,teletextinputtipos apenas. Especifica quanto da entrada é mostrada. Basicamente, cria o mesmo resultado que definir a propriedade CSSwidthcom algumas especialidades. A unidade real do valor depende do tipo de entrada. Parapasswordetext, é um número de caracteres (ouemunidades) com um valor padrão de20, e para outros, épixels. A largura do CSS tem precedência sobre o atributo de tamanho.src

Válido apenas para o image botão de entrada, src é uma especificação de string o URL do arquivo de imagem a ser exibido para representar o botão gráfico de envio. Veja o tipo de entrada de imagem.

step

Válido para os tipos de entrada numérica, incluindo number, data tipos de entrada / time e range, o atributo step é um número que especifica a granularidade à qual o valor deve obedecer.

Se não for incluído explicitamente:

  • step padroniza 1 para number e range.
  • Para os tipos de entrada de data / hora, step é expresso em segundos, com a etapa padrão sendo 60 segundos . O fator de escala do passo é 1000 (que converte os segundos em milissegundos, como usado em outros algoritmos).

O valor deve ser um número positivo — inteiro ou flutuante — ou o valor especial any, o que significa que nenhuma revisão está implícita e qualquer valor é permitido (exceto outras restrições, como min e max).

Se any não for definido explicitamente, os valores válidos para number, tipos de entrada de data / hora e range os tipos de entrada são iguais à base da revisão – o valor min e incrementos do valor da etapa, até max valor, se especificado.

Por exemplo, se você tiver <input type="number" min="10" step="2">, qualquer número inteiro par, 10 ou superior, é válido. Se omitido, <input type="number">, qualquer número inteiro é válido, mas flutuantes (como 4.2) não são válidos, porque step o padrão é 1. Para 4.2 ser válido, step teria de ser definido como any, 0,1 , 0,2 ou qualquer min valor teria que ser um número terminando em .2, como <input type="number" min="-5.2">

Nota: Quando os dados inseridos pelo usuário não aderem à configuração de revisão, o valor é considerado inválido na validação de restrição e corresponderá a :invalid pseudoclass.

Consulte a validação do lado do cliente para obter mais informações.

tabindex

Atributo global válido para todos os elementos, incluindo todos os tipos de entrada, um atributo inteiro indicando se o elemento pode receber o foco de entrada (é focalizável), se ele deve participar da navegação sequencial do teclado. são focalizáveis, este atributo não deve ser usado em controles de formulário, porque isso exigiria o gerenciamento do foco nos solicitar para todos os elementos dentro do documento com o risco de prejudicar a usabilidade e acessibilidade se feito incorretamente.

title

Atributo global válido para todos os elementos, incluindo todos os tipos de entrada , contendo um texto que representa informações consultivas relacionadas ao elemento ao qual pertence. Essas informações podem normalmente, mas não necessariamente, ser apresentadas ao usuário como uma dica de ferramenta. O título NÃO deve ser usado como a explicação principal da finalidade do controle de formulário. Em vez disso, use o elemento <label> com um atributo for definido para o controle de formulário “s id atributo. Consulte os rótulos abaixo.

type

Uma string que especifica o tipo de controle a ser renderizado. Por exemplo, para criar uma caixa de seleção, um valor de checkbox é usado. Se omitido (ou um valor desconhecido é especificado), o tipo de entrada text é usado, criando um campo de entrada de texto simples.

Os valores permitidos estão listados nos <input> tipos acima.

value

O valor do controle de entrada. Quando especificado no HTML, este é o valor inicial e, a partir de então, pode ser alterado ou recuperado a qualquer momento usando JavaScript para acessar o respectivo HTMLInputElement objeto “s value. O atributo value é sempre opcional, embora deva ser considerado obrigatório para checkbox, radio e hidden.

width

Válido para image botão de entrada apenas, o width é a largura do arquivo de imagem a ser exibido para representar o botão de envio gráfico. Veja o tipo de entrada de imagem.

Leave a Reply

Deixe uma resposta

O seu endereço de email não será publicado. Campos obrigatórios marcados com *