javascript - 除了切换内容之外，关闭页面上任何位置的切换 div

Question

我正在与正在切换的 div 作斗争，当我单击 id 为 #togglesearch 的链接时，我所拥有的一切都工作正常，但我想要的是能够在以下情况下关闭已切换的可见 div我单击页面上除已切换的 div 之外的任意位置。

这就是我现在所拥有的:

    <script type="text/javascript">
jQuery(document).ready(function($){

jQuery('#togglesearch').click(function() {
        jQuery('.toggle-search').slideToggle('fast');
        return false;
    });
});
</script>

html 很简单:

<a href="#" id="togglesearch">Slide Toggle</a>

<div class="toggle-search" style="display:none;">
<ul>
<li><a href="#">Link One</a></li>
<li><a href="#">Link Two</a></li>
<li><a href="#">Link Three</a></li>
</ul>
</div><!-- end toggle content -->

.toggle-search 是正在切换的 div，但我不希望它在单击该 div 时关闭，就像页面上的其他任何地方一样。

谢谢。

Answer 1

给它和 id = 'toggle-search' 并尝试此代码。

$('body').click(function(evt){    
       if(evt.target.id == "toggle-search") {
	   return;
	}else if(evt.target.id == "togglesearch") {
	  // toggle here
           jQuery('.toggle-search').slideToggle('fast');
	} else {
           jQuery('.toggle-search').slideUp('fast');
}
});