Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk Memilih Pilihan Drop-Down dengan Penerangan Teksnya dengan jQuery?

Bagaimana untuk Memilih Pilihan Drop-Down dengan Penerangan Teksnya dengan jQuery?

DDD
DDDasal
2024-11-03 06:38:03696semak imbas

How to Select a Drop-Down Option by Its Text Description with jQuery?

Menetapkan Pilihan Drop-Down yang Dipilih oleh Penerangan Teks dengan jQuery

Dalam bidang pembangunan web, memilih elemen dalam pilihan kawalan berdasarkan penerangan teksnya sering timbul. Walaupun menetapkan pilihan mengikut nilainya adalah mudah, mencari nilai yang sepadan untuk penerangan teks yang diberikan boleh menjadi satu cabaran.

Kejadian Pertanyaan

Keperluan untuk fungsi ini berpunca daripada situasi di mana pembolehubah JavaScript memegang rentetan teks, dan tujuannya adalah untuk memilih pilihan lungsur turun yang teksnya sepadan dengan rentetan ini. Tidak seperti pemilihan berasaskan nilai, yang menggunakan sintaks $("#my-select").val(myVal), tugasan ini memerlukan pendekatan yang lebih rumit.

Menyelesaikan Enigma

Untuk jQuery versi 1.6 dan ke atas, penyelesaiannya terletak pada memanfaatkan kaedah penapis() dan prop(). Kaedah penapis() menyaring semua pilihan dalam kawalan pilih, membandingkan penerangan teksnya dengan rentetan yang dikehendaki. Elemen yang terhasil kemudian disasarkan oleh kaedah prop(), menetapkan atribut yang dipilih kepada benar.

Contoh Pelaksanaan

Pertimbangkan kawalan pilihan dengan dua pilihan: 'Satu' dan 'Dua'. Kod berikut menggambarkan cara memilih pilihan dengan teks 'Dua' menggunakan pendekatan berasaskan teks:

<code class="javascript">var text1 = 'Two';
$("select option").filter(function() {
  //may want to use $.trim in here
  return $(this).text() == text1;
}).prop('selected', true);</code>

Kod ini secara berkesan memilih pilihan 'Dua' dalam senarai lungsur berdasarkan teksnya penerangan, walaupun tanpa mengetahui nilainya.

Atas ialah kandungan terperinci Bagaimana untuk Memilih Pilihan Drop-Down dengan Penerangan Teksnya dengan jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn