prevent bootstrap tooltip from hiding on click over it

jquery, tooltip, twitter-bootstrap-3

Solution

May I suggest triggering the popover `manually`

var close = true;
$('[data-toggle="popover"]').popover({trigger:"manual"});

$(document).on('mousedown', function (e) {
    if($(e.target).hasClass('popover-content'))
        close = false;
    else
        close = true; 
});

$('[data-toggle="popover"]').on("blur",function(){
    if(close)
        $(this).popover('hide');
    else 
       $(this).focus();
});

$('[data-toggle="popover"]').on("focus",function(){
   if(close)
       $(this).popover('show'); 
});

Example: Fiddle

Update fix for the tabbing issue:

Change the `.blur` function to the following:

$('[data-toggle="popover"]').on("blur",function(){
    if(close)
        $(this).popover('hide');
    else {
       $(this).focus();
       close = true;
    }
});

Fiddle

Problem

I want to prevent the tooltip from hiding when i click over it. except that wherever i click on body it should hide it. Tooltip should work even on tabbing. js fiddle: http://jsfiddle.net/C5GBU/41/ html: ``` <div class="bs-example tooltip-demo"> <div class="bs-example-tooltips"> <input type="text" class="form-control" data-container="body" data-toggle="popover" data-placement="top" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." data-original-title="" title=""/> <input type="text" class="form-control" data-container="body" data-toggle="popover" data-placement="bottom" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." data-original-title="" title=""/> <input type="text" class="form-control" data-container="body" data-toggle="popover" data-placement="right" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." data-original-title="" title=""/> </div> </div> ``` jquery: ``` $('[data-toggle="popover"]').popover({trigger:"focus"}); $('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'); } }); }); ```

Original source