¿Cómo cerrar los popovers Bootstrap (o cualquier elemento en general) cuando un usuario hace clic fuera de él?

Question

Estoy usando el objeto popover de la biblioteca Bootstrap de Twitter en modo manual y me preguntaba cómo debería cerrar el tooltip cuando el usuario hace clic fuera de él.

Aquí es mi HTML:

<a id="stats-bar" rel="popover" data-placement="top" data-trigger="manual" data-title="Title here" data-content="Hello everyone.">Test</a> 

y mi JavaScript:

$('#stats-bar').click(function(e) { 
     $(this).popover('show'); 
}); 

¿Cómo puedo ocultar el popover cuando el usuario hace clic en cualquier lugar, pero el propio popover? Pensé en usar un div transparente fijo detrás del popover y establecer su evento click, pero no estoy seguro de que sea la mejor manera.

Answer 1

Opté por usar un div transparente fijo detrás del popover y establecí su evento click ya que esta parece ser la solución más robusta y simple.

Answer 2

¿Qué tal un clic de escucha de evento genérico que desencadena en donde quiera que haga clic dentro del cuerpo? Mira esta publicación, se parece a lo que intentas lograr.

https://stackoverflow.com/a/2125122/1013422

Se podría usar esto para cerrar el popover real

$('#stats-bar').popover('hide') 

yo sólo definir la función cuando se ejecuta el evento emergente y luego retirarlo una vez que haya cerrado la ventana emergente, que forma en que no estás escuchando constantemente los eventos de clic.

Answer 3

que terminaron el cableado hasta el evento documento, haga clic y ocultar cualquier información sobre herramientas en ese punto

 $(document).click(function (e) 
     { 
      // check the parents to see if we are inside of a tool tip. If the click came 
      // from outside the tooltip, then hide our tooltip 
      if ($(e.target).parents('.tooltip').length == 0) $('[data-original-title]').tooltip('hide'); 
     }); 

Si está utilizando una opción de disparo manual y el cableado hasta el evento click para mostrar la información sobre herramientas que necesitará llamar a e.stopPropagation() para evitar que el evento de clic de documento se active al mostrar la información sobre herramientas.