【发布时间】:2015-03-09 20:24:46
【问题描述】:
我需要 标签,它应该在光标移动时显示工具提示,并且应该在点击时放下弹出框。但是当我将光标移到弹出框上方时,也会显示工具提示。检查它: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})
})
【问题讨论】:
-
"光标移动"??
-
"光标移动" == "悬停" ?
-
听起来你想要
container: 'body'在你的弹出框选项中。
标签: twitter-bootstrap twitter-bootstrap-3 tooltip popover