溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

jquery如何實(shí)現(xiàn)點(diǎn)擊隱藏元素

發(fā)布時(shí)間：2022-12-15 10:03:18 來(lái)源：億速云 閱讀：111 作者：iii 欄目：web開(kāi)發(fā)

今天小編給大家分享一下jquery如何實(shí)現(xiàn)點(diǎn)擊隱藏元素的相關(guān)知識(shí)點(diǎn)，內(nèi)容詳細(xì)，邏輯清晰，相信大部分人都還太了解這方面的知識(shí)，所以分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后有所收獲，下面我們一起來(lái)了解一下吧。

實(shí)現(xiàn)步驟：1、利用click()函數(shù)給按鈕元素綁定點(diǎn)擊事件，并設(shè)置事件處理函數(shù)，語(yǔ)法“$("button").click(function() {//點(diǎn)擊事件發(fā)生后，執(zhí)行的代碼});”；2、在事件處理函數(shù)中，使用hide()函數(shù)隱藏指定元素即可，語(yǔ)法“$(selector).hide(speed,callback)”。

在jquery中，可以利用click()和hide()方法來(lái)實(shí)現(xiàn)點(diǎn)擊隱藏元素。

實(shí)現(xiàn)步驟：

步驟1：利用click()函數(shù)給按鈕元素綁定點(diǎn)擊事件，并設(shè)置事件處理函數(shù)

$("button").click(function() {
	//點(diǎn)擊事件發(fā)生后，執(zhí)行的代碼
});

在事件處理函數(shù)中，寫(xiě)入的代碼就是點(diǎn)擊后實(shí)現(xiàn)的效果代碼

步驟2：在事件處理函數(shù)中，使用hide()函數(shù)隱藏指定元素

$(selector).hide(speed,callback)

示例代碼：

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-3.6.1.min.js"></script>
		<script>
			$(document).ready(function() {
				$("button").click(function() {
					$("div").hide();
					$("span").hide();
				});
			});
		</script>
		<style>
			div{
				border: 1px solid red;
				background-color: palegoldenrod;
			}
			p,span{
				background-color: yellow;
			}
		</style>
	</head>
	<body>
		<div>需要隱藏的div元素</div>
		<span>需要隱藏的span元素</span>
		<p>p元素</p>
		<button>點(diǎn)擊按鈕隱藏元素</button>
	</body>
</html>

jquery如何實(shí)現(xiàn)點(diǎn)擊隱藏元素

說(shuō)明：

  • click()方法用于綁定點(diǎn)擊事件，設(shè)置事件處理函數(shù)

當(dāng)單擊元素時(shí)，發(fā)生 click 事件。

click() 方法觸發(fā) click 事件，或規(guī)定當(dāng)發(fā)生 click 事件時(shí)運(yùn)行的函數(shù)。

語(yǔ)法：

//觸發(fā)被選元素的 click 事件：
$(selector).click()

//添加函數(shù)到 click 事件：
$(selector).click(function)

  • hide()方法用于隱藏指定元素

語(yǔ)法

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

參數(shù)描述
speed可選。規(guī)定隱藏效果的速度。

可能的值：

  • 毫秒

  • "slow"

  • "fast"

easing可選。規(guī)定在動(dòng)畫(huà)的不同點(diǎn)上元素的速度。默認(rèn)值為 "swing"。

可能的值：

  • "swing" - 在開(kāi)頭/結(jié)尾移動(dòng)慢，在中間移動(dòng)快

  • "linear" - 勻速移動(dòng)

提示：擴(kuò)展插件中提供更多可用的 easing 函數(shù)。
callbac可選。hide() 方法執(zhí)行完之后，要執(zhí)行的函數(shù)。

注釋?zhuān)弘[藏的元素不會(huì)被完全顯示（不再影響頁(yè)面的布局）。

提示：如需顯示隱藏的元素，請(qǐng)查看 show() 方法。

以上就是“jquery如何實(shí)現(xiàn)點(diǎn)擊隱藏元素”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家閱讀完這篇文章都有很大的收獲，小編每天都會(huì)為大家更新不同的知識(shí)，如果還想學(xué)習(xí)更多的知識(shí)，請(qǐng)關(guān)注億速云行業(yè)資訊頻道。

向AI問(wèn)一下細(xì)節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱：is@yisu.com進(jìn)行舉報(bào)，并提供相關(guān)證據(jù)，一經(jīng)查實(shí)，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手