Clikcの外側のトグルメニュー - メニューを非表示にして閉じるボタン

Question

私はjqueruとfoundation zurb data-responsive-toggleを使用します。それらを外にクリックするとどのようにメニューを閉じることができます。私はこの1つのコードを試してみますが、私が外をクリックすると隠され、クリックしてリンクも隠れてしまいます。これを防ぐ方法。

$(".navigation-mobile").click(function (event) { 
     $(".menu-toggle").removeClass("open"); 
     $(this).removeClass("active").css('display', 'none'); 
     event.stopPropagation(); 
     event.preventDefault(); 
    }) 

はまた、私は私のために、この1

$(window).click(function (e) { 
     var isActive = $('#mobile-nav-menu').hasClass('active'); 
     if(isActive){ 
      $('#mobile-nav-menu').removeClass("active").css('display', 'none'); 
      e.preventDefault(); 
      e.stopPropagation(); 
     } 
    }); 

<div class="mobile-menu no-js" data-responsive-toggle="mobile-nav-menu" data-hide-for="large" data-close-on-click> 
    <div class="row column"> 
    <div class="top-bar-left"> 
     <a class="logo" href="/html/index.html"><img src="../images/egl-logo.png" alt="logo"></a> 
    </div> 
    <div class="top-bar-right"><span class="icon icon-search color-white"></span> 
     <div class="menu-block show-for-medium"> 
     <ul class="menu"> 
      <li><a class="primary small" href="analizes-grozs.html"><span class="icon icon-cart"><span class="path1"></span><span class="path2"></span><span class="path3"></span><span class="path4"></span></span>Grozs</a></li> 
     </ul> 
     </div> 
     <button class="menu-toggle" type="button" data-toggle></button> 
    </div> 
    </div> 
</div> 
<div class="navigation-mobile no-js hide-for-large" id="mobile-nav-menu"> 
    <div class="row column padd-off"> 
    <div class="navigation-mobile-search"> 
     <input type="text" placeholder="Meklēt"><span class="icon icon-search"></span> 
    </div> 
    <div class="navigation-mobile-wrapper"> 

     <div class="menu-block"> 
     <ul class="vertical menu" data-accordion-menu> 
      <li></li> 
     </ul> 
     </div> 
    </div> 
    </div> 
</div> 

Answer 1

イッツ仕事をしようとしたHow do I detect a click outside an element?

$(window).click(function() { 
     var isActive = $('#mobile-nav-menu').hasClass('active'); 
     if(isActive){ 
      $('#mobile-nav-menu').removeClass("active").css('display', 'none'); 
      $('.menu-toggle').toggleClass('open'); 

     } 
    }); 
    $('.navigation-mobile-wrapper').click(function(event){ 
    event.stopPropagation(); 
    });