¿Cómo cerrar Bootstrap Popovers (o cualquier elemento en general) cuando un usuario hace clic 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 la información sobre herramientas cuando el usuario hace clic de ella.

Aquí está 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 que no sea el Popover? Pensé en usar un Div transparente fijo detrás del Popover y establecer su evento de clic, pero no estoy seguro de que esa sea la mejor manera.

Answer 1

Opté por usar un DIV transparente fijo detrás del Popover y establecer su evento de clic, ya que parece la solución más robusta y simple.

Answer 2

Terminé cableado al evento de clic en el documento 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 activación manual y cableado hasta el evento de clic para mostrar la información sobre herramientas, deberá llamar a e.stoppropagation () para evitar que el evento del documento haga clic en disparar al mostrar la información sobre herramientas.

Answer 3

¿Qué pasa con un oyente de eventos de clic genérico que se desencadena donde haga clic en el cuerpo? Mira esta publicación, se parece a lo que estás tratando de lograr.

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

Usarías esto para cerrar el Popover real

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

Solo definiría la función cuando se ejecuta el evento emergente y luego lo eliminaría una vez que haya cerrado la ventana emergente, de esa manera no está escuchando constantemente los eventos de clic.