防止在弹出窗口上显示工具提示

Question

我需要标签，它应该在光标移动时显示工具提示，并且应该在单击时放下弹出窗口。但是当我将光标移到弹出窗口上方时，也会显示工具提示。检查一下：https://jsfiddle.net/ivictbor/re15cuby/2/ .

Html:

 <span data-toggle="tooltip" data-placement="bottom" title="sometext"> 
    <a id="my_uniq_id" href="javascript:void(0);" >          
        link</a>
   </span>

JS:

$( "#my_uniq_id" ).on( "click", function drop_popover() {
 id = 'my_uniq_id'
 var el = $("#"+id);
 $( "body" ).append(
        '<div id="' +id+'_hldr'+'" style="display: none;">'+
          'popover holder code'+
        '</div>'
 );
 el.popover({ 
        placement : 'bottom',
        html : true,
        trigger: 'manual',
        title: ': <a href="#" style="float:right;"><span class="glyphicon glyphicon-remove-circle" '+
        'onclick="$(\'#'+id+'\').popover(\'hide\');"></span></a>',
        content: function() {
          return $('#'+id+'_hldr').html();
        },
    }).click(function(e) {
        e.preventDefault();
    });
    el.popover('show');
})

$(function () {
  $('[data-toggle="tooltip"]').tooltip({html: true})
})

Answer 1

这应该可以解决问题：

 $('[data-toggle="tooltip"]').tooltip({html: true}).on('click', function(){
            $(this).tooltip('hide');
        });

Answer 2

需要在弹出窗口选项中添加“容器：'body'”：

el.popover({ 
    placement : 'bottom',
    container: 'body',
    html : true,

感谢 cvrebert

防止在弹出窗口上显示工具提示

Prevent showing tooltip on popover

twitter-bootstrap

twitter-bootstrap-3

tooltip

popover