可視性を検出し、別の要素のクリックで非表示にします

Question

この作業を行うためにいくつかのコードをまとめましたが、Jqueryのスキルには限界があります。私は私の構文が完全に間違っていると仮定します。あなたの援助のために事前に感謝:)

// jQuery selector to get an element 
var query = $('#menu .sub-menu'); 

// check if element is Visible 
var isVisible = query.is(':visible'); 

if (isVisible === true) { 
    // element is Visible 
    $("#menu").click(function(e) { 
    query.hide(); 
    e.stopPropagation(); 
    } else { 
    // element is Hidden 
    } 

Answer 1

あなたの同じコードは、ちょうど.ready()方法でwraped働いているとはe.stopPropagation();後})を追加しました。それはあなたの問題を担当するあなたのコードのエラーでしたあなたはあなたのブラウザのコンソールでそのエラーをチェックすることができました。

$(document).ready(function() { 
 
    // jQuery selector to get an element 
 
    var query = $('#menu .sub-menu'); 
 

 
    // check if element is Visible 
 
    var isVisible = query.is(':visible'); 
 

 
    if (isVisible === true) { 
 
     // element is Visible 
 
     $("#menu").click(function(e) { 
 
      query.hide(); 
 
      e.stopPropagation(); 
 
     }); 
 
    } else { 
 
     // element is Hidden 
 
    } 
 
});

.sub-menu {background: yellow;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="menu"> 
 
\t Menu 
 
\t <div class="sub-menu"> 
 
\t \t Sub Menu 
 
\t </div> 
 
</div>