Comment puis-je fermer / ignorer Bootstrap Popover lorsque je clique sur l'élément déclencheur popover?
jsFiddle: http://jsfiddle.net/kAYyR/
Capture d'écran:
Voici ce qui fonctionne:
- Ouvrir la liste sur le bouton cliquez sur
- Fermer la fenêtre pop-over sur cliquez à l'extérieur de liste
- Fermer la fenêtre pop-over sur cliquez de
.close
bouton
MAIS... je ne peux pas obtenir la liste à se fermer lorsque vous cliquez sur le bouton d'origine à nouveau. Au lieu de la liste clignote et s'éteint de nouveau.
Les reproduire vous-même ici.
Comment puis-je y arriver?
HTML:
<button id="popoverId" class="popoverThis btn btn-large btn-danger">Click to toggle popover</button>
<div id="popoverContent" class="hide">This <em>rich</em> <pre>html</pre> content goes inside popover</div>
JS:
$('#popoverId').popover({
html: true,
title: "Popover Title",
content: function () {
return $('#popoverContent').html();
}
});
var isVisible = false;
var clickedAway = false;
$('.popoverThis').popover({
html: true,
trigger: 'manual'
}).click(function (e) {
$(this).popover('show');
$('.popover-content').append('<a class="close" style="position: absolute; top: 0; right: 6px;">×</a>');
clickedAway = false
isVisible = true
e.preventDefault()
});
$(document).click(function (e) {
if (isVisible & clickedAway) {
$('.popoverThis').popover('hide')
isVisible = clickedAway = false
} else {
clickedAway = true
}
});
source d'informationauteur Ryan
Vous devez vous connecter pour publier un commentaire.
Voulez-vous travailler comme ça ?
http://jsfiddle.net/kAYyR/3/
J'utilise ceci:
il peut simplement fait en utilisant ce code