Bootstrap popover, hide on click outside?

using bootstrap popover, and now im trying to get this code to click outside the popover to close the popover:

$('body').on('click', function (e) {
    $('[data-toggle="popover"]').each(function () {
        //the 'is' for buttons that trigger popups
        //the 'has' for icons within a button that triggers a popup
        if (!$(this).is(e.target) && $(this).has(e.target).length === 0 && $('.popover').has(e.target).length === 0) {
            $(this).popover('hide');
        }
    });
});

But when i use this part, i can close the popover but i cant click the other buttons, anyone got any idea how i can do that?

All the buttons:

<a href="#" class="btn btn-xs btn-primary" data-toggle="popover">This opens popover</a>
<a href="#" class="btn btn-xs btn-primary">Other link</a> <- Doesn't work 
<a href="#" class="btn btn-xs btn-primary">Other link</a> <- Doesn't work 

Answers


I found this : http://bootply.com/99372

$('body').on('click', function (e) {
    $('[data-toggle=popover]').each(function () {
        // hide any open popovers when the anywhere else in the body is clicked
        if (!$(this).is(e.target) && $(this).has(e.target).length === 0 && $('.popover').has(e.target).length === 0) {
            $(this).popover('hide');
        }
    });
});

It's almost the same code as you...


Need Your Help

Writing to a binary file from a struct part of a linked list

c++ struct binaryfiles writing

I'm trying to understand how to properly right data to a binary file. The data is being written but when read back in for testing it is obvious I am not writing it properly. The data is read/writte...

Wordpress - Can't output image (from custom field) for previous and next posts

wordpress post navigation next

I am working on a portfolio website. Whenever a portfolio piece is clicked, the user is taken to a page that shows details about that piece (i.e. more photos and information). There will also be pr...