JQuery点滴之toggle

　2009-11-17 00:00:00　来源：WEB开发网　　　

核心提示：今天针对这个JQuery里面的toggle聊几句，文章中涉及到了一些问题望牛牛们能帮忙解惑一下，JQuery点滴之toggle，今天重点一个toggle(fn,fn,….)函数,主要是用来切换某个事件的轮换操作，比如：对一个按钮的点击事件和一个DIV的背景，主要是用来切换元素的显示状态，如果一个元素是显示

今天针对这个JQuery里面的toggle聊几句，文章中涉及到了一些问题望牛牛们能帮忙解惑一下。

今天重点一个toggle(fn,fn,….)函数,主要是用来切换某个事件的轮换操作。

比如：对一个按钮的点击事件和一个DIV的背景，点击一次按钮，将DIV的背景显示为蓝色，点击第二次的时候要将DIV的

背景色改为黑色。

我们定义的HTML代码如下：

　　　1:　　<body> 　　　2:　　<input　type="button"　id="btnShow"　value="Toggle"/> 　　　3:　　<div　id="DivToggle">此处显示　　id　"DivToggle"　的内容</div> 　　　4:　　</body>

定义的最初的样式如下：

　　　1:　　#DivToggle　{ 　　　2:　　　　　　height:　150px; 　　　3:　　　　　　width:　200px; 　　　4:　　　　　　margin:　50px; 　　　5:　　　　　　background-color:　#6CC; 　　　6:　　}

在toggle(fn,fn,….);先明白一个toggle()的函数，主要是用来切换元素的显示状态。如果一个元素是显示的，那么调用.toggle()之后就变得隐藏了。

JQuery代码：

　　　1:　　　　　　<script　type="text/javascript"> 　　　2:　　　　　　　　　　$( 　　　3:　　　　　　　　　　function()　{ 　　　4:　　　　　　　　　　$("#btnShow").click(function(event)　{ 　　　5:　　　　　　　　　　　　　　　　　　$("#DivToggle").toggle(); 　　　6:　　　　　　　　　　　　　　}); 　　　7:　　　　　　　　　　} 　　　8:　　　　　　　　　　); 　　　9:　　　　　　</script>

1 2 3 下一页