Usando o Elemento Datalist para Sugestões de Entrada Predefinidas
O elemento <datalist> em HTML é utilizado para criar uma lista predefinida de opções para um elemento <input>. Ele permite que o usuário selecione uma opção da lista, mas também oferece a possibilidade de inserir um valor próprio, caso deseje. A lista de valores predefinidos permanece oculta até que o usuário comece a digitar no campo de texto associado. O <datalist> é associado a um atributo id, e o <input> é vinculado a ele utilizando o atributo list.
index.html
O elemento <datalist> é útil quando se deseja fornecer sugestões úteis sem limitar os usuários a um conjunto fixo de escolhas.
Exemplo
Quando o usuário digita no campo, o navegador exibe as categorias predefinidas. Se nenhuma corresponder, o usuário ainda pode inserir seu próprio valor.
index.html
<label for="category">: descreve o propósito do campo de entrada;<input type="text" name="category" id="category" list="categories"/>: campo de texto que exibe sugestões de uma datalist vinculada;<datalist id="categories">: contém opções predefinidas que aparecem como sugestões ao digitar;<option value="...">: representa cada item sugerido.
1. Qual elemento HTML é utilizado para criar uma lista suspensa com múltiplas opções?
2. Qual é a finalidade do elemento datalist?
3. Qual atributo é utilizado para vincular um elemento datalist a um elemento input?
Obrigado pelo seu feedback!
Pergunte à IA
Pergunte à IA
Pergunte o que quiser ou experimente uma das perguntas sugeridas para iniciar nosso bate-papo
Incrível!
Completion taxa melhorada para 2.38Usando o Elemento Datalist para Sugestões de Entrada Predefinidas
Deslize para mostrar o menu
O elemento <datalist> em HTML é utilizado para criar uma lista predefinida de opções para um elemento <input>. Ele permite que o usuário selecione uma opção da lista, mas também oferece a possibilidade de inserir um valor próprio, caso deseje. A lista de valores predefinidos permanece oculta até que o usuário comece a digitar no campo de texto associado. O <datalist> é associado a um atributo id, e o <input> é vinculado a ele utilizando o atributo list.
index.html
O elemento <datalist> é útil quando se deseja fornecer sugestões úteis sem limitar os usuários a um conjunto fixo de escolhas.
Exemplo
Quando o usuário digita no campo, o navegador exibe as categorias predefinidas. Se nenhuma corresponder, o usuário ainda pode inserir seu próprio valor.
index.html
<label for="category">: descreve o propósito do campo de entrada;<input type="text" name="category" id="category" list="categories"/>: campo de texto que exibe sugestões de uma datalist vinculada;<datalist id="categories">: contém opções predefinidas que aparecem como sugestões ao digitar;<option value="...">: representa cada item sugerido.
1. Qual elemento HTML é utilizado para criar uma lista suspensa com múltiplas opções?
2. Qual é a finalidade do elemento datalist?
3. Qual atributo é utilizado para vincular um elemento datalist a um elemento input?
Obrigado pelo seu feedback!
