TechCodeview

Neste artigo, aprenderemos como obter os valores selecionados na lista suspensa com a ajuda do jQuery. Em primeiro lugar, entenderemos este artigo usando jQuery, seletor de jQuery e método jQuery val(). Depois disso, entenderemos este tópico com a ajuda de vários exemplos.

O que você quer dizer com jQuery?

jQuery é uma biblioteca JavaScript rápida, leve, pequena e rica em recursos.

tipos de rede

Utilize o jQuery: seletor selecionado em combinação com o método val () para encontrar o valor da opção selecionada em uma lista suspensa.

O seletor em jQuery:

É um elemento HTML no qual a declaração é aplicada.

Por exemplo: selecionado, verificado, etc.

Selecionado é usado para especificar a escolha padrão quando o formulário é carregado inicialmente.

Método val () em jQuery:

Este método é usado para obter os valores dos elementos do formulário ou definir o valor do atributo usado para os elementos selecionados.

Sintaxe:

 $(selector).val (); 

Exemplo:

 $('input: text').val ('javaTpoint!'); 

Lista suspensa com e tag.

As tags select e option são usadas para criar menus suspensos. Eles permitem que o usuário selecione opções únicas ou múltiplas em uma lista de opções. Todas as opções não são mostradas na tela, mas ficam visíveis quando puxam a lista suspensa. Eles são usados ​​para economizar espaço, pois apenas um item da lista é exibido.

Para criar listas suspensas, tag é usada em vez de tag . A tag emparelhada começa com a tag de abertura e termina com a tag de fechamento. Esta tag deve ser usada com a tag .

Sintaxe:

hospedeiro linux

 Text Label-1 Text Label-2 ………………………………………………………………………………………………….. ………………………………………………………………………………………………….. 

Os vários atributos usados ​​com a tag são:

Múltiplo:É usado para definir a tag para aceitar inúmeras opções. Por padrão, pode levar uma única opção selecionada pelo usuário. Para selecionar várias opções, o usuário deve pressionar clique enquanto clica na opção.Nome:É usado para especificar um nome para a lista suspensa.

Os vários atributos usados ​​com tag são:

Valor:É usado para especificar o valor que é enviado quando o formulário é enviado. Se o atributo value for omitido na tag, o conteúdo do título será usado.Selecionado:É usado para especificar a escolha pré-selecionada quando o formulário é carregado inicialmente em um navegador.

Os exemplos a seguir são usados ​​para obter o valor selecionado na lista suspensa em jQuery.

Exemplo 1:

Como obter o valor selecionado na lista suspensa em jQuery.

 Get Selected Value in drop-down using jQuery h1 { color: green; } h5 { color: green; } h4 { color: green; } p { color: red; } .select { margin: 40px; width: 60%; height: 300px; padding: 30px; border: 2px solid green; } body { background-color: pink; } $(document).ready (function () { $(&apos;select.country&apos;).change (function () { var selectedCountry = $(this).children(&apos;option:selected&apos;).val(); alert (&apos;You have selected the country - &apos; + selectedCountry); }); }); <p> <b> Get Selected Value in drop-down using jQuery </b> </p> <h4> Select Country from drop-down list: </h4> <br> United States India United Kingdom Brazil Germany <br> <br> <b> Get selected values from list </b> 

Explicação:

No exemplo acima, criamos uma lista suspensa com a ajuda de e tag. Neste, se selecionarmos um valor múltiplo da lista e criarmos um após selecionar o elemento múltiplo da lista e clicar em um botão, ele exibe uma mensagem de alerta com o elemento selecionado na lista suspensa.

mostrar aos usuários mysql

 United States India United Kingdom Brazil Germany <br> <br> <b> Get selected values from list </b> 

Aqui,

Size ='3' é usado para exibir o número de elementos mostrados na lista suspensa, multiple é usado para selecionar vários valores na lista suspensa.

Saída:

A saída deste exemplo é fornecida abaixo.