toggle()方法的效果就是切换元素的可见状态；即如果元素是可见的，切换为隐藏的；如果元素是隐藏的，切换为可见的。
例子：
$(function(){ $("#content").toggle(); })
<p id="content" style="display:none">这里原来是隐藏看不到的</p>
当有点击事件时，另一区域可见状态切换可以这么写：
$(document).ready(function(){ $("#test").click( function(){ $("#content").toggle(); } ); });
<p id="test"><input type="button" value="点击这里" /></p> <p id="content" style="display:none">当点击上面的“点击这里“字样，这里的内容将隐藏与显示之间切换</p>
下面说一下toggle(fn,fn)方法的使用，效果是：每次点击后依次调用函数；如果点击了一个匹配的元素，则触发指定的第一个函数，当再次点击同一元素时，则触发指定的第二个函数，如果有更多函数，则再次触发，直到最后一个。随后的每次点击都重复对这几个函数的轮番调用。注意这里本身已经有点击触发调用函数的功能，不需要另外.click(fn)了
例子：
$(document).ready(function(){ $("#test").toggle(function(){ $("#content").hide('slow'); },function(){ $("#content").show('fast'); }); });
<p id="test"><input type="button" value="点击这里" /></p> <p id="content" style="display:none">当点击上面的“点击这里“字样，这里的内容将隐藏与显示之间切换</p>