顯示 隱藏 jquery

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>