我需要< a>在光标移动时显示shoud显示工具提示的标签,并且在点击时应该弹出popover。但是当我将光标移动到popover上方时,也会显示工具提示。检查一下: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})
})
答案 0 :(得分:0)
应该这样做:
$('[data-toggle="tooltip"]').tooltip({html: true}).on('click', function(){
$(this).tooltip('hide');
});
答案 1 :(得分:0)
需要添加容器:&#39; body&#39;&#39;在popover选项中:
el.popover({
placement : 'bottom',
container: 'body',
html : true,
感谢cvrebert