用jquery實作點擊按鈕時顯示內容，再次點擊按鈕時隱藏內容的效果。我們可以使用toggle() 方法來實現此效果。
下面我們就結合具體的程式碼範例，介紹jquery實作點擊隱藏顯示內容的效果方法。
程式碼範例如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jquery实现点击显示隐藏内容示例</title>
</head>
<body>
<button type="button">显示公告</button>
<p style="display: none">
2018年下半年面试网上报名时间：2018年12月11日8:00-14日16:00.
符合面试报考条件的考生在规定时间内登录教育部中小学教师资格网(http://ntce.neea.edu.cn)，按照栏目指引进行网
上报名，北京师范大学四年级公费师范生选择“北京师范大学在校师范生考区”，其他考生选择“北京考区”，再选择面试类别、面试科目等，
完成其他信息录入。
请准确选择考区。报名时间截止后，报名系统将关闭，考区信息也将无法修改，未能在规定时间报名或报名时选择考区错误的不
能参加考试。
</p>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
$("button").click(function () {
$("p").toggle("slow",function () {
if($("p").is(":visible")){
alert("这里是公告内容");
}else {
alert("公告内容已隐藏");
}
});
});
</script>
</body>
</html>這裡我們為button按鈕新增了一個點擊事件，當我們點擊按鈕時，就會呼叫上述程式碼中一系列函數方法動作。首先取得了p標籤，並透過toggle方法設定判斷p標籤的內容顯示與否。
toggle() 方法切換元素的可見狀態。如果被選元素可見，則隱藏這些元素，如果被選元素隱藏，則顯示這些元素。
最終效果如下所示：
註：此效果適用於透過jQuery 隱藏的元素，或在CSS 中宣告display:none 的元素（但不適用於visibility:hidden 的元素）。
這篇文章就是關於jquery實現點擊顯示隱藏內容的效果方法介紹，也很簡單，希望對需要的朋友有所幫助！
以上是jquery怎麼實現點擊隱藏顯示效果的詳細內容。更多資訊請關注PHP中文網其他相關文章！
熱AI工具
Undresser.AI Undress
人工智慧驅動的應用程序，用於創建逼真的裸體照片
AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。
Undress AI Tool
免費脫衣圖片
Clothoff.io
AI脫衣器
AI Hentai Generator
免費產生 AI 無盡。
熱門文章
熱工具
Atom編輯器mac版下載
最受歡迎的的開源編輯器
MantisBT
Mantis是一個易於部署的基於Web的缺陷追蹤工具，用於幫助產品缺陷追蹤。它需要PHP、MySQL和一個Web伺服器。請查看我們的演示和託管服務。
ZendStudio 13.5.1 Mac
強大的PHP整合開發環境
EditPlus 中文破解版
體積小，語法高亮，不支援程式碼提示功能
SecLists
SecLists是最終安全測試人員的伙伴。它是一個包含各種類型清單的集合，這些清單在安全評估過程中經常使用，而且都在一個地方。 SecLists透過方便地提供安全測試人員可能需要的所有列表，幫助提高安全測試的效率和生產力。清單類型包括使用者名稱、密碼、URL、模糊測試有效載荷、敏感資料模式、Web shell等等。測試人員只需將此儲存庫拉到新的測試機上，他就可以存取所需的每種類型的清單。
