jQueryのクリック（）

Question

のdivを閉じるために、HTML

<div class="lang-currency-field"> 
    <div class="lang-currency-links">links here</div> 
</div> 

jQueryの

<script>  
    $('.lang-currency-button').click(function() { 
     $('.lang-currency-field').fadeIn(); 
    });  

    $('.lang-currency-links').click(function() { 
     $('.lang-currency-field').fadeOut(); 
    });  

    $('.lang-currency-field').outside('click', function(){ 
     $('.lang-currency-field').fadeOut(); 
    });  
</script>   

私はstackoverflowの上、ここで多くの記事やフォーラムを読んだが、私はこれを並べ替えることができません何らかの理由でアウト。

ページのどこかをクリックしてlang-currency-field divを閉じる/ fadeOutするにはどうすればよいですか？

私はリンクの1つをクリックしてもうまく閉じますが、実際にはdivをクリックしないと閉じません。

お願いします。ありがとうございました。

Answer 1

を試してみてください。 divのハンドラはdiv内のクリックを防ぎますが、リンク上ではドキュメントレベルのハンドラがdivを閉じることはできません。注意：ページの他のハンドラに注意する必要があります。これは、クリックがドキュメントにバブルアップすることを許可するか（閉じているdivの外側にある場合）、divを閉じて処理するか、あなたは完全に別のページに（あなたはdivを閉じる必要はありません）。 div外の要素のハンドラーでの伝播を停止すると、文書レベルのハンドラーは呼び出されません。

<script> 
    $(function() { // this will make sure the relevant DOM elements are loaded first 
     $('.lang-currency-button').click(function(e) { 
      e.stopPropagation(); // because we don't want to close immediately after opening 
      $('.lang-currency-field').fadeIn(); 
     });  

     $('.lang-currency-links').click(function(e) { 
      e.stopPropagation(); // prevent bubbling since we don't need other handlers. 
      $('.lang-currency-field').fadeOut(); 
     });  

     $('.lang-currency-field').click(function(e){ 
      e.stopPropagation(); // prevent bubbling to document handler so div stays open when clicked inside, but not on a link 
     }); 

     $(document).click(function() { 
      $('.lang-currency-field').fadeOut(); 
     }); 
    }); 
</script> 

Answer 2

は、私がイベントバブリング防止のdivにハンドラを提案し、文書に「外」ハンドラを委任します

$('page').click(function() { $('.lang-currency-field').fadeOut(); });