Rumah > Artikel > hujung hadapan web > Bagaimana untuk mengalih keluar pilihan yang ditentukan dalam jquery
Bagaimana untuk mengalih keluar pilihan yang ditentukan dalam jquery
- PHPzasal
- 2023-05-23 15:22:371472semak imbas
jQuery ialah perpustakaan JavaScript yang biasa digunakan yang boleh memanipulasi DOM dan mengendalikan acara dengan mudah. Apabila membangunkan aplikasi web, anda selalunya perlu mengendalikan kotak lungsur, seperti menambah, memadam dan mengubah suai pilihan. Untuk pilihan penyingkiran, kita boleh menggunakan kaedah remove() jQuery. Artikel ini memperincikan cara untuk mengalih keluar pilihan yang ditentukan daripada kotak lungsur menggunakan jQuery.
1. Bagaimana untuk mendapatkan pilihan kotak lungsur
Untuk memadamkan pilihan dalam kotak lungsur, anda perlu mendapatkan pilihan yang sepadan terlebih dahulu. Kita boleh menggunakan kaedah find() jQuery untuk mendapatkan semua pilihan dalam kotak lungsur turun Kodnya adalah seperti berikut:
var options = $('#select-id').find('option');di mana, #select-id ialah ID kotak lungsur, dan <.> ialah pemilih terbina dalam jQuery, yang mewakili elemen. Kod di atas akan mengembalikan objek jQuery yang mengandungi semua pilihan dalam kotak lungsur. option
var option = $('#select-id').find('option').eq(2); Antaranya, parameter kaedah mewakili indeks pilihan, mengira dari 0. eq()
option.remove();Dalam ini cara, anda boleh memadamkan pilihan yang ditentukan. Jika anda perlu mengalih keluar berbilang pilihan, anda boleh menggunakan kaedah each() jQuery untuk merentasi senarai pilihan dan memadamkannya satu persatu Kod sampel adalah seperti berikut:
var options = $('#select-id').find('option');
options.each(function() {
if($(this).val() == 'value1' || $(this).val() == 'value2') {
$(this).remove();
}
});Di atas kod akan memadamkan nilai dalam kotak lungsur turun Pilihan untuk atau value1. value2
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery 删除下拉框选项</title>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>
<body>
<select id="fruit">
<option value="">请选择水果</option>
<option value="apple">苹果</option>
<option value="banana">香蕉</option>
<option value="orange">橙子</option>
<option value="watermelon">西瓜</option>
</select>
<button id="remove-btn">删除水果</button>
<script>
$(function() {
$('#remove-btn').click(function() {
var options = $('#fruit').find('option');
options.each(function() {
if($(this).val() == 'banana' || $(this).val() == 'watermelon') {
$(this).remove();
}
});
});
});
</script>
</body>
</html>Dalam contoh di atas, Kami mencipta kotak lungsur dengan lima pilihan dan butang padam. Apabila butang diklik, kod akan mengalih keluar pilihan dengan nilai atau banana. Anda boleh melihat kesan demonstrasi dengan menjalankan kod di atas. watermelon
Atas ialah kandungan terperinci Bagaimana untuk mengalih keluar pilihan yang ditentukan dalam jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!