欧美一区二区三区老妇人-欧美做爰猛烈大尺度电-99久久夜色精品国产亚洲a-亚洲福利视频一区二区

jquery如何實現(xiàn)顯示與隱藏的互換

本篇內(nèi)容主要講解“jquery如何實現(xiàn)顯示與隱藏的互換”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學(xué)習(xí)“jquery如何實現(xiàn)顯示與隱藏的互換”吧!

創(chuàng)新互聯(lián)-專業(yè)網(wǎng)站定制、快速模板網(wǎng)站建設(shè)、高性價比金沙網(wǎng)站開發(fā)、企業(yè)建站全套包干低至880元,成熟完善的模板庫,直接使用。一站式金沙網(wǎng)站制作公司更省心,省錢,快速模板網(wǎng)站建設(shè)找我們，業(yè)務(wù)覆蓋金沙地區(qū)。費用合理售后完善，10年實體公司更值得信賴。

互換方法：1、用“元素對象.toggle()”，當(dāng)元素是可見狀態(tài)則隱藏元素，當(dāng)元素不可見則顯示元素；2、用“元素對象.slideToggle()”，當(dāng)元素可見則隱藏元素，當(dāng)元素不可見則顯示元素；3、用“元素對象.fadeToggle()”。

jquery如何實現(xiàn)顯示與隱藏的互換

本教程操作環(huán)境：windows7系統(tǒng)、jquery1.10.2版本、Dell G3電腦。

jquery實現(xiàn)顯示與隱藏互換有三種方法：

  • toggle() 方法

  • slideToggle() 方法

  • fadeToggle() 方法

1、toggle() 方法

toggle() 方法在被選元素上進行 hide() 和 show() 之間的切換。

該方法檢查被選元素的可見狀態(tài)。如果一個元素是隱藏的，則運行 show()，如果一個元素是可見的，則運行 hide() - 這會造成一種切換的效果。

注釋：隱藏的元素不會被完全顯示（不再影響頁面的布局）。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<script src="js/jquery-1.10.2.min.js"></script>
		<script>
			$(document).ready(function() {
				$("button").click(function() {
					$("p").toggle();
				});
			});
		</script>
	</head>
	<body>

		<p>這是一個段落。</p>
		<button>切換 hide() 和 show()</button>

	</body>
</html>

jquery如何實現(xiàn)顯示與隱藏的互換

2、slideToggle() 方法

slideToggle() 方法在被選元素上進行 slideUp() 和 slideDown() 之間的切換。

該方法檢查被選元素的可見狀態(tài)。如果一個元素是隱藏的，則運行 slideDown()，如果一個元素是可見的，則運行 slideUp() - 這會造成一種切換的效果。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<script src="js/jquery-1.10.2.min.js"></script>
		<script>
			$(document).ready(function() {
				$("button").click(function() {
					$("p").slideToggle();
				});
			});
		</script>
	</head>
	<body>

		<p>這是一個段落。</p>
		<button>切換 slideUp() 和 slideDown()</button>

	</body>
</html>

jquery如何實現(xiàn)顯示與隱藏的互換

3、fadeToggle() 方法

fadeToggle() 方法在 fadeIn() 和 fadeOut() 方法之間切換。

  • 如果元素是淡出顯示的，fadeToggle() 會使用淡入效果顯示它們。

  • 如果元素是淡入顯示的，fadeToggle() 會使用淡出效果顯示它們。

注釋：隱藏的元素不會被完全顯示（不再影響頁面的布局）。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<script src="js/jquery-1.10.2.min.js"></script>
		<script>
			$(document).ready(function() {
				$("button").click(function() {
					$("#div1").fadeToggle();
					$("#div2").fadeToggle("slow");
					$("#div3").fadeToggle(3000);
				});
			});
		</script>
	</head>
	<body>

		<p>實例演示了 fadeToggle() 使用了不同的 speed(速度) 參數(shù)。</p>
		<button>點擊淡入/淡出</button>
		<br><br>
		<div id="div1" style="width:80px;height:80px;background-color:red;"></div>
		<br>
		<div id="div2" style="width:80px;height:80px;background-color:green;"></div>
		<br>
		<div id="div3" style="width:80px;height:80px;background-color:blue;"></div>

	</body>
</html>

jquery如何實現(xiàn)顯示與隱藏的互換

到此，相信大家對“jquery如何實現(xiàn)顯示與隱藏的互換”有了更深的了解，不妨來實際操作一番吧！這里是創(chuàng)新互聯(lián)網(wǎng)站，更多相關(guān)內(nèi)容可以進入相關(guān)頻道進行查詢，關(guān)注我們，繼續(xù)學(xué)習(xí)！

網(wǎng)站題目：jquery如何實現(xiàn)顯示與隱藏的互換
文章來源：http://www.chinadenli.net/article2/iiicoc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供全網(wǎng)營銷推廣、電子商務(wù)、網(wǎng)站設(shè)計公司、網(wǎng)站設(shè)計、網(wǎng)站收錄、動態(tài)網(wǎng)站

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)

成都網(wǎng)站建設(shè)公司