2012-05-02 24 views
12

Powiel możliwe:
jQuery get specific option tag text
How to get the text of the selected option of a select using jquery?Jak uzyskać tekst o wybranej wartości z rozwijanej listy?

Mam listę rozwijaną i chcę wiedzieć tekstu wybranego elementu. Na przykład:

<select> 
    <option value="1">Volvo</option> 
    <option value="2">Saab</option> 
    <option value="3">Mercedes</option> 
</select> 

Jeśli znam wybraną wartość, w jaki sposób mogę uzyskać jej wartość tekstową? Na przykład, jeśli wartość wynosi 1, jak mogę uzyskać Volvo?

Pomoc doceniane.

Odpowiedz

29

Można użyć option:selected uzyskać wybraną opcję elementu select, wówczas metoda text():

$("select option:selected").text(); 

Oto przykład:

console.log($("select option:selected").text());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<select> 
 
    <option value="1">Volvo</option> 
 
    <option value="2" selected="selected">Saab</option> 
 
    <option value="3">Mercedes</option> 
 
</select>

+0

Następnie można dodawać linki do poszczególnych funkcji jQuery w docs ... W każdym razie nie podoba mi się sposób, w jaki to robi w swojej edycji. Może być prostsze z '$ (" select) .val() '. Jak już powiedziałem, do ciebie i +1 przy okazji ... – gdoron

+0

ok i kodowane' alert ($ ("# nazwa preset -" + nazwa_rodziny + "opcja : selected "). text());' ale ma błąd, jakikolwiek pomysł, dlaczego to nie działa ..? – guitarlass

+0

Jaki jest błąd i jaką wartość ma 'rname'? –

14
$("#select_id").find("option:selected").text(); 

Jest to pomocne, jeśli twoja kontrola jest po stronie serwera. W .NET wygląda:

$('#<%= dropdownID.ClientID %>').find("option:selected").text(); 
1

Najprostszym sposobem jest poprzez CSS3 $("select option:selected") a następnie użyj funkcji .text() lub .html(). w zależności od tego, co chcesz mieć.

+2

CSS3? Gdzie to wchodzi? –

+0

Rzeczywiście,': selected' nie jest CSS3, jest to jedno z ulepszeń selektora jQuery. –

+1

_ "Bo": wybrane 'jest rozszerzeniem jQuery i nie jest częścią specyfikacji CSS, zapytania używające': selected' nie mogą ... ... "_ [źródło] (http://api.jquery.com/selected-selector/) – gdoron

0

Cześć jeśli masz DropDownList jak ten

<select id="testID"> 
<option value="1">Value1</option> 
<option value="2">Value2</option> 
<option value="3">Value3</option> 
<option value="4">Value4</option> 
<option value="5">Value5</option> 
<option value="6">Value6</option> 
</select> 
<input type="button" value="Get dropdown selected Value" onclick="getHTML();"> 

po podaniu identyfikatora DropdownList wystarczy dodać kod jquery jak ten

function getHTML() 
{ 
     var display=$('#testID option:selected').html(); 
     alert(display); 
} 
Powiązane problemy