本文探讨了JQuery中的toggle函数，详细介绍了如何利用toggle切换元素的显示状态，包括手动控制显示隐藏、设置速度以及结合hover事件实现显示隐藏效果。同时，文章提到了toggle(fn,fn,…)的轮换操作，并讨论了其实现方式和潜在的逻辑混淆问题，最后提出了一种简化实现效果的代码方案。"
7714807,1297651,Excel到SharePoint列表的导入步骤,"['sharepoint', 'excel', '工具', '服务器', '文档']
今天重点一个toggle(fn,fn,….)函数,主要是用来切换某个事件的轮换操作。
比如：对一个按钮的点击事件和一个DIV的背景，点击一次按钮，将DIV的背景显示为蓝色，点击第二次的时候要将DIV的
背景色改为黑色。
我们定义的HTML代码如下：
<body>
<input type="button" id="btnShow" value="Toggle"/>
<div id="DivToggle">此处显示 id "DivToggle" 的内容</div>
</body>
定义的最初的样式如下：
比如：对一个按钮的点击事件和一个DIV的背景，点击一次按钮，将DIV的背景显示为蓝色，点击第二次的时候要将DIV的
背景色改为黑色。
我们定义的HTML代码如下：
<body>
<input type="button" id="btnShow" value="Toggle"/>
<div id="DivToggle">此处显示 id "DivToggle" 的内容</div>
</body>
定义的最初的样式如下：
#DivToggle {
height: 150px;
width: 200px;
margin: 50px;
background-color: #6CC;
} 在toggle(fn,fn,….);先明白一个toggle()的函数，主要是用来切换元素的显示状态。如果一个元素是显示的，那么调用.toggle()之后就变得隐藏了。
JQuery代码：
<script type="text/javascript">
$(
function() {
$("#btnShow").click(function(event) {
$("#DivToggle").toggle();
});
}
);
</script>
点击按钮
最低0.47元/天 解锁文章
扫一扫
5560
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
