這是一個示例：
1 <html> 2 <head> 3 <script type="text/javascript" src="http://keleyi.com/keleyi/pmedia/jquery/jquery-1.10.2.min.js"></script> 4 <script type="text/javascript"> 5 $(document).ready(function(){ 6 $(".btn1").click(function(){ 7 $("p").toggle(); //toggle()方法進行顯示隱藏交互事件，如果顯示的就進行隱藏，如果是隱藏的就顯示 8 }); 9 $(".btn2").toggle(2000,function(){ 10 $(".div2").toggle(); //callback 11 }); 12 }); 13 </script> 14 </head> 15 <body> 16 <p>This is a paragraph.</p> 17 <button class="btn1">Toggle</button> 18 <button class="btn2">Toggle2</button> 19 <div class="div1">http://www.cnblogs.com/sosoft/</div> 20 <div class="div2" style="display:none">柔城</div> 21 </body> 22 </html>
效果體驗：http://hovertree.com/texiao/jquery/8.htm
示例中用到的toggle()方法：
定義和用法
toggle() 方法切換元素的可見狀態。
如果被選元素可見，則隱藏這些元素，如果被選元素隱藏，則顯示這些元素。
語法
$(selector).toggle(speed,callback,switch)
| 參數 | 描述 |
|---|---|
| speed | 可選。規定元素從可見到隱藏的速度（或者相反）。默認為 "0"。 可能的值：
在設置速度的情況下，元素從可見到隱藏的過程中，會逐漸地改變其高度、寬度、外邊距、內邊距和透明度。 如果設置此參數，則無法使用 switch 參數。 |
| callback | 可選。toggle 函數執行完之后，要執行的函數。 如需學習更多有關 callback 的內容，請訪問我們的 jQuery Callback 這一章。 除非設置了 speed 參數，否則不能設置該參數。 |
| switch | 可選。布爾值。規定 toggle 是否隱藏或顯示所有被選元素。
如果設置此參數，則無法使用 speed 和 callback 參數。 |
提示和注釋
注釋：該效果適用於通過 jQuery 隱藏的元素，或在 CSS 中聲明 display:none 的元素（但不適用於 visibility:hidden 的元素）。