2

所以我的 javascript.js 文件中有一个像这样的通用选择器:

$(document).on('hover', '*[rel=tooltip]', function(e){
    $(this).tooltip();
});

在我的 HTML 文件中,我有可能具有的标签,rel='tooltip'即:

<i class="icon-ban-circle" rel="tooltip" title="Ban" data-placement="bottom"></i>
<a rel="tooltip" title="hover for tooltip">Text</a>

此解决方案有效,但需要注意。您必须再次将鼠标悬停在元素上才能显示工具提示。我喜欢这样一个事实,即我可以在我的 HTML 中添加一个rel="tooltip"and 并title="some text"立即显示工具提示并希望保持这种便利性。

我创建了一个演示这个问题的 JSFiddle:http: //jsfiddle.net/xKKMM/

4

1 回答 1

3

尝试:

$(document).on({
    'mouseenter': function (e) {
        $(this).tooltip('show');
    },
        'mouseeleave': function (e) {
        $(this).tooltip('hide');
    }
}, '*[rel=tooltip]');

小提琴

在您的情况下发生的只是在第一次悬停期间它通过调用工具提示构造函数来设置工具提示。然后,当您悬停时,它已经设置好,因此在悬停时会显示。您可以将设置与此结合使用。但这将在每次悬停时调用构造函数。因此,您可以像这样立即执行此操作来避免它。

$('*[rel=tooltip]').tooltip();
于 2013-09-23T19:11:59.090 回答