jQueryのは：どこにも離れ要素のクリックで要素を非表示に

Question

可能性の重複：
How to detect a click outside an element?

私は、ユーザーが以外の場所をクリックした場合「DIV」は隠していることを達成しようとしています要素上にユーザーがボタンをクリックすると、次のコードでtoggle（）を実行します。私は、ボタンのクリックがプラスになり、 'Details'要素が見えるならば、画面の他の部分に反応します。

$('.nav-toggle').click(function(){ 
     //get collapse content selector 
     var collapse_content_selector = $(this).attr('href'); 

     //make the collapse content to be shown or hide 
     var toggle_switch = $(this); 
     $(collapse_content_selector).toggle(function(){ 
      if($(this).css('display')=='none'){ 
          //change the button label to be 'Show' 
      toggle_switch.html('Show Details'); 
      }else{ 
          //change the button label to be 'Hide' 
      toggle_switch.html('Hide Details'); 
      } 
     }); 
    }); 

Answer 1

event delegationのコンセプトに頼ることができます。私はあなたが他の部分との統合により、何を意味するのか理解できなかった

$(function() { 
    $(document).on('click', function(e) { 
     if (e.target.id === 'div1') { 
      alert('Div Clicked !!'); 
     } else { 
      $('#div1').hide(); 
     } 

    }) 
});​ 

チェックFIDDLE

。これは基本的な考え方..です

Answer 2

あなたは（リンク、boutton、whatheverのような...）他の要素にdivのときに、ユーザーのクリックを非表示にするjQuery .blur()機能を使用することができます

要素がフォーカスを失うされたときにblurイベントは（火ですユーザーがDOMツリー上の別の要素を選択）

私はあなたのトグルとのリンクを理解していません。トグルボタンがDIVを管理している場合は、ボタンのテキストを更新するのと同時にdivにhide（）/ show（）を配置するトグル機能の内部にあります。