除了切换内容之外，在页面的任何位置关闭切换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');
}
});