// tooltip demo
$('div').tooltip({
selector: "a[data-toggle=tooltip]"
})
HTML:
<div style="text-align: center; width: 100%; margin-top: 50px;">
<a href="#" data-toggle="tooltip" class="postAuthor" data-original-title="@username">Full Name</a> <p/><p/>
<a href="#" data-toggle="tooltip" class="postAuthor" data-original-title="@username">Full Name</a><p/>
<a href="#" data-toggle="tooltip" class="postAuthor" data-original-title="@username">Full Name</a><p/>
<a href="#" data-toggle="tooltip" class="postAuthor" data-original-title="@username">Full Name</a><p/>
<a href="#" data-toggle="tooltip" class="postAuthor" data-original-title="@username">Full Name</a>
</div>
.tooltip()
函数在链接上启动工具提示效果,而不是显示工具提示
说明:
当第一次悬停时触发$(this).tooltip()
,它首先实例化插件。然后最终在第二次悬停时获取工具提示。
解决方案:
在您的代码中添加此内容:
$(function() {
$("a").tooltip();
});
我认为如果你让JQuery处理mouseover事件,并将所有代码放在$(document).ready中,会更加清晰。
类似的问题和解决方案可以在这里找到: Jquery onmouseover triggers on second event