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。非经特殊声明,原始代码版权归原作者所有,本译文未经允许或授权,请勿转载或复制。