jQuery toggle 使用

本文主要是介绍jQuery toggle 使用，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

jQuery 中 toggle 作用

切换元素的显示与隐藏状态

如果被选元素可见，则隐藏这些元素，如果被选元素隐藏，则显示这些元素。

<body>
<div class="header"><div class="logo"><a href="###"><img src="images/logo.png" /></a></div><div class="search"><form><input type="text" class="sBox" value="请输入关键字" onfocus="if(value=='请输入关键字') {value=''}" onblur="if (value=='') {value='请输入关键字'}"/><input type="submit" class="sBtn" value="" /></form></div>
</div>
<div class="nav"><div class="c-nav"><ul><li><a href="###" class="current">首页</a></li><li class="h-m"><a href="###">爱生活<i></i></a><ul class="menu l-life"><li><a href="###">养生<em></em></a></li><li><a href="###">杂谈<em></em></a></li><li><a href="###">穿着<em></em></a></li><li><a href="###">健身</a></li></ul></li><li class="h-m"><a href="###">资讯<i></i></a><ul class="menu r-news"><li><a href="###">八卦<em></em></a></li><li><a href="###">趣事<em></em></a></li><li><a href="###">奇闻<em></em></a></li><li><a href="###">发现</a></li></ul></li><li class="h-m"><a href="###">谈情<i></i></a><ul class="menu t-feelings"><li><a href="###">约会<em></em></a></li><li><a href="###">性情</a></li></ul></li><li class="h-m"><a href="###">找娱乐<i></i></a><ul class="menu l-ent"><li><a href="###">娱乐<em></em></a></li><li><a href="###">资讯<em></em></a></li><li><a href="###">历史</a></li></ul></li><li><a href="###">资料</a></li><li><a href="###">美图</a></li><li><a href="###">专题</a></li></ul><div class="weixin"><a href="###"><i></i>关注微信</a><div class="QRcode"><img src="images/QRcode.png" /></div></div></div>
</div><div class="subNav"><div class="hot"><b>热点推荐：</b><a href="###">秘法</a><a href="###">图片</a><a href="###">图片</a><a href="###">视频</a></div>
</div>
<!--导航条js--> 
<script>
$(document).ready(function(e) {$('.nav .c-nav ul li').hover(function(){if($(this).hasClass('h-m')){$('.subNav .hot').toggle()}})
});
</script> 
</body>

默认显示

鼠标悬浮

参数	描述
speed	可选。规定元素从可见到隐藏的速度（或者相反）。默认为 "0"。可能的值：毫秒（比如 1500） "slow" "normal" "fast" 在设置速度的情况下，元素从可见到隐藏的过程中，会逐渐地改变其高度、宽度、外边距、内边距和透明度。如果设置此参数，则无法使用 switch 参数。
callback	可选。toggle 函数执行完之后，要执行的函数。如需学习更多有关 callback 的内容，请访问我们的 jQuery Callback 这一章。除非设置了 speed 参数，否则不能设置该参数。
switch	可选。布尔值。规定 toggle 是否隐藏或显示所有被选元素。 True - 显示所有元素 False - 隐藏所有元素如果设置此参数，则无法使用 speed 和 callback 参数。

参数

描述

speed

可选。规定元素从可见到隐藏的速度（或者相反）。默认为 "0"。

可能的值：