Wie schließe ich Bootstrap -Popover (oder ein Element im Allgemeinen), wenn ein Benutzer davon abklickt?

StackOverflow https://stackoverflow.com/questions/9302654

  •  25-10-2019
  •  | 
  •  

Frage

Ich verwende das Popover -Objekt aus der Bootstrap -Bibliothek von Twitter im manuellen Modus und habe mich gefragt, wie ich das Tooltip schließen sollte, wenn der Benutzer davon abklickt.

Hier ist mein HTML:

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

Und mein JavaScript:

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

Wie kann ich den Popover verbergen, wenn der Benutzer überall außer dem Popover selbst klickt? Ich dachte daran, eine feste transparente DIV hinter dem Popover zu verwenden und sein Klickereignis festzulegen, aber ich bin mir nicht sicher, ob dies der beste Weg ist.

War es hilfreich?

Lösung 2

Ich habe mich für eine feste transparente Div hinter dem Popover entschieden und sein Klickereignis festgelegt, da dies die robusteste und einfachste Lösung erscheint.

Andere Tipps

Am Ende war die Verkabelung zum Dokument -Klick -Ereignis und ausblende alle Tooltips zu diesem Zeitpunkt aus

      $(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');
      });

Wenn Sie eine manuelle Auslöseroption verwenden und mit dem Klickereignis verkabelt werden, um den Tooltip anzuzeigen, müssen Sie E.StopPropagation () aufrufen, um das Dokument -Klick -Ereignis beim Zeugen des Tooltip zu verhindern.

Was ist mit einem generischen Klick -Ereignis -Listener, der auslöst, wo immer Sie in den Körper klicken? Schauen Sie sich diesen Beitrag an, es sieht ähnlich aus wie das, was Sie erreichen möchten.

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

Sie würden dies verwenden, um das tatsächliche Popover zu schließen

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

Ich würde die Funktion nur definieren, wenn das Popup -Ereignis ausgeführt wird, und sie dann entfernen, sobald Sie das Popup geschlossen haben. Auf diese Weise hören Sie nicht ständig auf Klickereignisse.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top