Bagaimana cara mendapatkan label opsi pilih dengan jQuery?


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

Nilainya dapat diambil dengan $select.val().

Bagaimana dengan label?

Apakah ada solusi yang akan berhasil di IE6?


Maksud Anda bagaimana mendapatkan nilai yang dipilih, nilai yang dipilih? yang ada di label kasus Anda?
semut

Pertanyaan ini harus diubah kata-katanya menjadi "Bagaimana cara mendapatkan teks opsi pilih dengan jQuery?" dan semua referensi ke label harus diganti dengan teks untuk menghindari kebingungan dengan atribut label.
Joel Davis

Jawaban:



22

Hai pertama berikan id untuk memilih sebagai

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

maka Anda dapat memanggil label yang dipilih seperti itu:

jQuery('#theid option:selected').text()

13

Sebagai referensi, ada juga labelatribut sekunder pada tag opsi:

//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>

6

Untuk mendapatkan label opsi tertentu dalam menu dropdown, Anda dapat melakukannya -

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

atau

$('#id_of_dropdown > option[value='value_to_be_Searched']').html();

3

Saya menemukan ini bermanfaat

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

Saat mengakses pemilih menggunakan thiskata kunci.

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


2

Coba ini:

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

Ini akan menarik teks yang ditampilkan untuk kedua gaya <option>elemen:

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

Jika memiliki labelatribut dan teks di dalam elemen, itu akan menggunakanlabel atribut, yang merupakan perilaku yang sama seperti browser.

Untuk anak cucu, ini telah diuji di bawah jQuery 3.1.1


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


0

Di peramban modern, Anda tidak memerlukan JQuery untuk ini. Sebagai gantinya gunakan

document.querySelectorAll('option:checked')

Atau tentukan elemen DOM apa pun, bukan document


Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.