Javascript 切换关闭外部单击

Javascript 切换关闭外部单击,javascript,Javascript,我正在为dd&dt使用toggle类,它工作正常,但我的问题是,如果用户单击外侧,我想关闭该切换。如何做到这一点 <script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.js"></script> <script type="text/javascript"> jQuery=$.noConflict(); jQuery(document).re

我正在为
dd&dt
使用toggle类,它工作正常,但我的问题是,如果用户单击外侧,我想关闭该切换。如何做到这一点

 <script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.js"></script>
    <script type="text/javascript">
    jQuery=$.noConflict();
    jQuery(document).ready(function() {
        jQuery('.navigation dd').hide(); 

        jQuery('.navigation dt').click(function(){ 
                jQuery(this).next('dd').slideToggle('slow');
                jQuery(this).toggleClass('glace_navigationlayer-collapsed'); 


            });


     }); 
    </script>

jQuery=$.noConflict();
jQuery(文档).ready(函数(){
jQuery('.navigation dd').hide();
jQuery('.navigation dt')。单击(函数(){
jQuery(this).next('dd').slideToggle('slow');
jQuery(this).toggleClass('glace_navigationlayer-collapsed');
});
}); 
你也可以试试--星展银行所拥有的一切都是正当的,(他在评论中写道),imho


您需要监听
上的单击,然后检查以确保目标位于导航组件之外

jQuery('body').on('click', function(evt) {
  var $target = $(evt.target);
  if ( !$target.closest('.navigation').length ) {
    // code to collpase the nav menu
  }
});
我还建议重构导航代码,使用单独的展开和折叠函数,而不是依赖
slideToggle
toggleClass


祝你好运

不太确定要求,但您可以尝试在mouseenter和mouseleave事件上实现上述要求。

但是,如果必须仅在单击时实现上述功能,那么必须将单击事件连接到覆盖整个html正文的容器上

jQuery('document')。而不是(“.navigation dt”)。单击(function(){})
这就是您要问的吗?它应该在你点击除开始类以外的任何内容时运行。@DBS感谢回复我会检查并让你知道谢谢回复我会检查并让你知道谢谢回复我会检查并让你知道谢谢回复我会检查并让你知道
jQuery('body').on('click', function(evt) {
  var $target = $(evt.target);
  if ( !$target.closest('.navigation').length ) {
    // code to collpase the nav menu
  }
});