【天天一個JQuery特效】根據可見狀態肯定是否顯示或隱藏元素（3）

時間 2019-11-17

標籤天天一個JQuery特效根據可見狀態肯定是否顯示隱藏元素欄目 JQuery 简体版

原文原文鏈接

效果圖示：javascript

主要代碼：html

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>根據可見狀態肯定 是否顯示或隱藏元素</title>
		<script src="js/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			$(document).ready(function(){
				//對單擊「隱藏」或顯示圖片 按鈕的響應
				$("#mytogglebtn").click(function(){
					$("#div1").toggle();
					var t = $("#mytogglebtn").text() == "隱藏圖片"?"顯示圖片" : "隱藏圖片";
					$("#mytogglebtn").text(t);
				});
				//對單擊「隱藏圖片」按鈕的響應
				$("#myhidebtn").click(function(){
					$("#div1").hide();
				});
				//對單擊「顯示圖片」按鈕的響應
				$("#myshowbtn").click(function(){
					$("#div1").show();
				});
			});
		</script>
	</head>
	<body>
		<button id="mytogglebtn" style="width: 130px;">隱藏圖片</button>
		<button id="myhidebtn" style="width: 130px;">隱藏圖片</button>
		<button id="myshowbtn" style="width: 130px;">顯示圖片</button><br />
		<div id="div1">
			<img src="img/banner-bg.jpg" width="400" height="150"/>
		</div>
	</body>
</html>

相關說明：java

在本例代碼中，若是被選中的元素已被顯示，調用hide（）方法則隱藏該元素，hide（）方法的語法聲明以下：jquery

$(selector).hide(speed,callback)

其中，speed和callback參數可選，speed默認值爲"0"，可能值爲毫秒值，callback參數，除非設置了speed參數，不然不能設置該參數。ide

若是被選元素已被隱藏，調用show（）方法則顯示這些元素，show（）方法的語法聲明以下：code

$(selector).show(speed,callback)

toggle()方法用於切換元素的可見狀態，若是被選中元素是可見的，則隱藏；相反，則顯示;toggle()方法的語法聲明以下:htm

$(selector).toggle(speed,callback,switch)

參數switch是一個可選參數，類型爲布爾值，該參數規定toggle（）方法是否隱藏或顯示全部被選元素；True表示顯示,False表示隱藏，若是設置了此參數，則沒法使用speed和callback。blog

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。