jQuery: Ocultar elemento al hacer clic en cualquier otro lugar aparte del elemento

Question

Duplicar posibles:
How to detect a click outside an element?

que estoy tratando de lograr que un 'div' esconde si el usuario hace clic en cualquier lugar excepto en el elemento. Tengo el siguiente código haciendo toggle() si el usuario hace clic en un botón. Quiero que el clic del botón permanezca más si el elemento 'Detalles' está visible y reacciona a otras partes de la pantalla.

$('.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

Puede recurrir al concepto de event delegation.

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

    }) 
});​ 

Comprobar FIDDLE

Yo no entendía lo que quería decir mediante la integración con la otra parte .. Esta es la idea básica ..

Answer 2

Usted puede utilizar la función jQuery .blur() para ocultar un div cuando el usuario haga clic en otro elemento (como enlace, boutton, whathever ..)

El evento es borroso fuego cuando un elemento es perder el foco (usuario seleccione otro elemento en el árbol DOM)

No entiendo el enlace con su palanca. Si su botón de alternar administra el DIV, dentro de la función de alternar debe colocar hide()/show() en el div, al mismo tiempo que actualiza el texto del botón.