web-dev-qa-db-fra.com

Comment obtenir le libellé de l'option choisie avec jQuery?

<select>
<option value="test">label </option>
</select>

La valeur peut être récupérée par $select.val().

Qu'en est-il de la label?

Existe-t-il une solution qui fonctionnera dans IE6?

100
user198729

Essaye ça:

$('select option:selected').text();
204
Sergey Kuznetsov

Salut d'abord donner un identifiant à la sélection en tant que 

<select id=theid>
<option value="test">label </option>
</select>

alors vous pouvez appeler le label sélectionné comme ça:

jQuery('#theid option:selected').text()
14
open-ecommerce.org

Pour référence, il existe également un attribut secondaire label sur la balise d'option:

//returns "GET THIS" when option is selected
$('#selecter :selected').attr('label'); 

Html

<select id="selecter">
<option value="test" label="GET THIS">
Option (also called label)</option>
</select>
9
kingPuppy

Pour obtenir le libellé d’une option spécifique dans une liste déroulante, vous pouvez essayer ceci - 

$('.class_of_dropdown > option[value='value_to_be_searched']').html();

ou

$('#id_of_dropdown > option[value='value_to_be_Searched']').html();
5
Snigdha Batra
$("select#selectbox option:eq(0)").text()

L'index 0 dans "option: eq (0)" peut être échangé contre l'option indexée que vous souhaitez récupérer.

Ceci est utile: http://www.myphpetc.com/2009/03/jquery-select-element-cheat-sheet.html

2
eugene

J'ai trouvé cela utile

$('select[name=users] option:selected').text()

Lorsque vous accédez au sélecteur à l’aide du mot clé this.

$(this).find('option:selected').text()
2
bmatovu

Essaye ça:

$('select option:selected').prop('label');

Ceci extraira le texte affiché pour les deux styles d’éléments <option>:

  • <option label="foo"><option> -> "foo"
  • <option>bar<option> -> "bar"

S'il contient à la fois un attribut label et du texte à l'intérieur de l'élément, il utilisera l'attribut label, qui a le même comportement que le navigateur.

Pour la postérité, cela a été testé sous jQuery 3.1.1

1
amphetamachine

Créé Plunker de travail pour cela . https://plnkr.co/edit/vR9aGoCwoOUL9tevIEen$('#console').append("<br/>"+$('#test_s :selected').text())

0
itwasnoteasy
<SELECT id="sel" onmouseover="alert(this.options[1].text);"
<option value=1>my love</option>
<option value=2>for u</option>
</SELECT>
0
meo

Dans les navigateurs modernes, JQuery n’a pas besoin de cela. Utilisez plutôt

document.querySelectorAll('option:checked')

Ou spécifiez n'importe quel élément DOM au lieu de document

0
John Henckel