Bagaimana untuk menyembunyikan pilihan dalam jquery-Soal Jawab bahagian hadapan-php.cn

Bagaimana untuk menyembunyikan pilihan dalam jquery

青灯夜游

Lepaskan： 2022-09-27 17:21:22

asal

2063 orang telah melayarinya

Langkah pelaksanaan: 1. Dapatkan elemen pilihan yang ditentukan melalui nilai atribut id Sintaks "$("#id value")" akan mengembalikan objek jquery yang mengandungi elemen pilihan yang ditentukan 2. Gunakan hide(. ), fadeOut() atau slideUp() untuk menyembunyikan elemen yang ditentukan, sintaksnya ialah "element object.hide();" atau "element object.fadeOut();" atau "element object.slideUp();".

Bagaimana untuk menyembunyikan pilihan dalam jquery

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi jquery 3.6.1, komputer Dell G3.

elemen pilihan Elemen pilihan

elemen pilihan mentakrifkan pilihan (entri) dalam senarai juntai bawah.

Pelayar memaparkan kandungan dalam teg Elemen pilihan

terletak di dalam elemen pilih.

<select>
	<option value="目的地">目的地</option>
	<option value="温州">温州</option>
	<option value="永嘉">永嘉</option>
	<option value="北京">北京</option>
</select>

Salin selepas log masuk

Bagaimana untuk menyembunyikan pilihan dalam jquery

Pilihan dalam senarai juntai bawah ialah elemen pilihan.

Bagaimana untuk menggunakan jquery untuk menyembunyikan pilihan?

Langkah pelaksanaan

Langkah 1: Dapatkan elemen pilihan yang ditentukan melalui nilai atribut id

$("#id值")

Salin selepas log masuk

Akan mengembalikan objek jquery yang mengandungi elemen pilihan yang ditentukan

2. Untuk menyembunyikan objek elemen yang diperoleh

anda boleh menggunakan hide(), fadeOut() atau fungsi slideUp () untuk menyembunyikan elemen yang ditentukan

$(selector).hide(speed,easing,callback)

$(selector).fadeOut(speed,easing,callback)

$(selector).slideUp(speed,easing,callback)

Salin selepas log masuk

Contoh: Biarkan elemen pilihan yang ditentukan menyembunyikan

hide() pelaksanaan

<!DOCTYPE html>
<html>
	<head>
		<script src="js/jquery-3.6.1.min.js"></script>
		</style>
		<script>
			$(document).ready(function() {
				$("button").click(function() {
					$("#start").hide();
				});
			});
		</script>
	</head>
	<body>
		<select size="4">
			<option value="目的地">目的地</option>
			<option value="温州">温州</option>
			<option id="start" value="永嘉">永嘉--需要隐藏</option>
			<option value="北京">北京</option>
		</select>
		<button>隐藏内容为“永嘉”的option元素</button>
	</body>
</html>

Salin selepas log masuk

Bagaimana untuk menyembunyikan pilihan dalam jquery

pelaksanaan fadeOut()

$(document).ready(function() {
	$("button").click(function() {
		$("#start").fadeOut();
	});
});

Salin selepas log masuk

Bagaimana untuk menyembunyikan pilihan dalam jquery

pelaksanaan slideUp()

$(document).ready(function() {
	$("button").click(function() {
		$("#start").slideUp();
	});
});

Salin selepas log masuk

Bagaimana untuk menyembunyikan pilihan dalam jquery

[Pembelajaran yang disyorkan: video jQuery tutorial , video bahagian hadapan web]

Atas ialah kandungan terperinci Bagaimana untuk menyembunyikan pilihan dalam jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!