Bootstrap Popover Dismissable is not working

Question

<a href="#" class="btn btn-warning" id="no_mls_entry" tabindex="2" data-toggle="popover" data-trigger="focus" data-placement="left auto" title="Early Bird Gets The Worm" data-content="Sometimes it takes some time for the MLS&reg; RETS pool to update your new listing. Loading it manually early, then sharing on social media will give you better exposure on Google.">Enter Without MLS #</a>

The above is my popover HTML syntax, set to data-trigger="focus" according to their instructions to make it dismiss on click.

And then on document ready, I run this:

$('#no_mls_entry').popover('show');

The popover shows up alright, but on clicking it, it does not go away.

Answer 1

It appears to be an issue with the way focus is being managed.

You could try the following to force the focus:

$('#no_mls_entry').popover('show').focus();

Here is an example of the code in bootply:

http://www.bootply.com/J1iTFk9M1Y

Alternatively, if you are willing to not show the popover on page load, you can load the popover with the following code and it will be triggered on pressing the button:

$('#no_mls_entry').popover();

Answer 2

你需要添加role="button"我相信