通過點擊任何其他位置來隱藏顯示/切換div。

Question

我能夠創建一個簡單的顯示/隱藏jQuery功能，如下面的代碼所示...

我想讓它顯示div時用戶不必點擊按鈕，使其隱藏再次。所以，當他們點擊頁面上的其他地方或當他們向下滾動時，它消失......

我試着重複這個相同的功能，但用body替換#hideshow但是搞砸了一切。

我可以幫忙嗎？

<a type='button' id='hideshow' value='hide/show' ><li class="glob">About</li></a> 

jQuery(document).ready(function(){ 
jQuery('#hideshow').live('click', function(event) {   
    jQuery('#about_box').slideToggle('show'); 
}); 
}); 

Answer 1

首先，.live()已過期，並在jQuery 1.9中刪除。您應該使用.on()。其次，如果你在body或document之類的地方放置點擊處理程序，則需要在不想觸發它的元素上放置一個點擊處理程序，並讓其調用event.stopPropagation()。

Answer 2

嘗試使用.blur()事件。

jQuery('#hideshow').blur(function() { 
    jQuery('#about_box').slideUp(); 
}); 

Answer 3

嘗試http://jsfiddle.net/X5xBs/

$(document).ready(function(){ 
$('#hideshow').on('click', function(event) {   
    $('#about_box').slideToggle('show'); 
}); 
    $('#hideshow').mouseleave(function() { 
    $('#about_box').slideToggle('hide'); 
}); 
});