使用不同的触发器显示/隐藏div-jquery

这可能是一个足够简单的问题（特别是对于JQuery大师而言），但我一直在回避

当用户单击Login/Register超链接和toggleClass函数以显示和隐藏加载时，我正在使用jQuery.support.cors函数从另一个页面远程加载表单。那部分有效。我的问题是，当用户单击页面上的任何其他位置时，我需要隐藏包含表单的div

p、 s.（表格不能在悬停时显示，这是一个全单击功能）

这是我修改过的代码（基本上是因为我不能在fiddle或code.pen中使用support.cors）

<li class="retrodropdown" aria-haspopup="true">
   <a href="#">Sign In / Register</a>
   <div class="retrodropdown-menu">
      <ul>
         <li>
            <div class="login-form">
               SHOW AND HIDE          
            </div>
        </li>
     </ul>
   </div>
</li>

这是一个

提前谢谢

看看这个

$(document).ready(function () {

   $('.retrodropdown a').click(function () {
      $(this).siblings('.retrodropdown-menu').show();
   });

   $('html').click(function () {
      $(this).find('.retrodropdown-menu').hide();
   })
});

基本上，您捕获文档上的主单击事件，然后检查单击是否在表单之外。如果是，则将其隐藏，并且不要忘记在显示它的单击事件上停止播放，否则它将再次触发文档单击，从而将其隐藏

$(document).ready(function () {

      $('.retrodropdown a').click(function (event) {
           $('.retrodropdown-menu').toggle();
           event.stopPropagation();
           event.preventDefault();
           return;
      });

      $(document).on('click',function (event) {           
        if(!$(event.target).closest('.retrodropdown-menu').length) {               
                if($('.retrodropdown-menu').is(":visible")) {                
                    $('.retrodropdown-menu').hide()
                    event.stopPropagation();
                    event.preventDefault();
                    return;
                }
            }    
      })
    });

---

不，先生。我在代码笔或我的应用程序中不工作。你到底想做什么，你能简要介绍一下吗？我想我在我的问题中做了。我需要一个包含表单（.retrodropdown菜单）的div，在登录/注册链接（retrodropdown a）上单击在显示和隐藏之间切换但是，当用户单击屏幕上的任何其他位置时，我也需要将其隐藏。干得好！不过，它现在不会切换超链接。但这是一个好的开始！只需将show（）更改为toggle（）。编辑代码笔并回答。

$(document).click(function(e){
    $(this).find('.retrodropdown-menu').hide();
});

$(document).ready(function () {

      $('.retrodropdown a').click(function (event) {
           $('.retrodropdown-menu').toggle();
           event.stopPropagation();
           event.preventDefault();
           return;
      });

      $(document).on('click',function (event) {           
        if(!$(event.target).closest('.retrodropdown-menu').length) {               
                if($('.retrodropdown-menu').is(":visible")) {                
                    $('.retrodropdown-menu').hide()
                    event.stopPropagation();
                    event.preventDefault();
                    return;
                }
            }    
      })
    });