toggle()方法用於檢查選定元素的可見性,以在選定元素的hide()和show()之間切換。
- 隱藏元素時,將運行show()。
- 當元素可見時,將運行hide()。
用法:
$(selector).toggle(speed, easing, callback)
參數:它具有三個可選參數:
- speed:用於指定切換效果的速度。可以是毫秒,可以是慢速也可以是快速。
- easing:它用於指定動畫不同點處元素的速度。
- callback:切換效果後立即調用的函數。
下麵是顯示toggle()方法的示例:
<!DOCTYPE html>
<html>
<head>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<script>
$(document).ready(function() {
$("button").click(function() {
$("#gfg").toggle();
});
});
</script>
<style>
#gfg {
color: green;
border: 5px solid black;
width: 200px;
text-align: center;
}
</style>
</style>
</head>
<body>
<div id="gfg">GeeksforGeeks</div>
<button>Click to hide() and show() the above div</button>
</body>
</html>
輸出:
在單擊按鈕之前:
單擊按鈕後:
再次單擊按鈕後:
相關用法
- JQuery add()用法及代碼示例
- JQuery die()用法及代碼示例
- JQuery css()用法及代碼示例
- JQuery before()用法及代碼示例
- JQuery off()用法及代碼示例
- JQuery get()用法及代碼示例
- JQuery is()用法及代碼示例
- JQuery getScript()用法及代碼示例
- JQuery slideDown()用法及代碼示例
- JQuery unload()用法及代碼示例
- JQuery slideToggle()用法及代碼示例
- JQuery ajaxSend()用法及代碼示例
- JQuery fadeIn()用法及代碼示例
注:本文由純淨天空篩選整理自Code_Mech大神的英文原創作品 jQuery | toggle() Method。非經特殊聲明,原始代碼版權歸原作者所有,本譯文未經允許或授權,請勿轉載或複製。