Come chiudere i pop-up Bootstrap (o qualsiasi oggetto in generale) quando un utente fa clic su di esso?

Question

Sto usando l'oggetto popover dalla libreria Bootstrap di Twitter in modalità manuale e mi chiedevo come avrei dovuto chiudere la descrizione quando l'utente ha fatto clic.

Ecco il mio HTML:

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

e la mia JavaScript:

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

Come posso nascondere il popover quando l'utente fa clic ovunque, ma la popover in sé? Ho pensato di usare un div trasparente fisso dietro il popover e di impostare il suo evento click, ma non sono sicuro che sia il modo migliore.

Answer 1

Ho optato per utilizzare un div trasparente fisso dietro il popover e impostare il suo evento click in modo che questo sembri la soluzione più robusta e semplice.

Answer 2

Che dire di un listener generico di eventi di clic che si attiva quando si fa clic nel corpo? Dai un'occhiata a questo post, sembra simile a quello che stai cercando di ottenere.

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

Si potrebbe utilizzare questo per chiudere la popover attuale

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

definirei solo la funzione quando viene eseguito l'evento pop-up e quindi rimuovere una volta che hai chiuso il popup, che modo in cui non ascolti costantemente gli eventi click.

Answer 3

ho finito il cablaggio fino alla manifestazione del documento click e nascondere eventuali tooltip a quel 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'); 
     }); 

Se si utilizza l'opzione di attivazione manuale e il cablaggio fino alla manifestazione Clicca per vedere il tooltip è necessario chiamare e.stopPropagation() per impedire che l'evento click del documento venga attivato quando viene visualizzata la descrizione comando.