Bootstrap .tooltip()' hide'事件冒泡而不管stopPropagation()

时间:2015-01-13 10:14:02

标签: jquery twitter-bootstrap twitter-bootstrap-tooltip

我们客户的应用程序在Bootstrap 2.3.2上运行,并且由于与一些旧插件的兼容性,仍然是jQuery 1.8.3。

该应用程序是一个包含文件夹和网格视图的媒体文件管理器。我们有一个文件管理器模式,可以在每个文件夹内打开。在模态中,您将看到文件夹中所有文件的列表,以及每个文件的控件(移动,重命名等)。控件由图标表示,因此为了清楚起见,我们还希望在用户将鼠标悬停在图标上时添加Bootstrap工具提示。

模态有以下jQuery代码绑定它 - 我们想在关闭模式时(之后)重新加载页面以显示当前文件夹中文件的任何更改:

// Listen for close event on file manager modal
$('#modal-manage-files').on('hide',function() {
    location.reload();
});

我们已使用以下代码将工具提示添加到模态中的控件图标...

$('.file-actions i.fa').tooltip({
    animation: false
});

...或此代码(它们都不起作用):

$('.file-actions i.fa')
    .tooltip({ trigger: 'manual', animation: 'false' })
    .on({
        mouseenter: function(e) {
            e.stopPropagation();
            $(this).tooltip('show');
        },
        mouseleave: function(e) {
            e.stopPropagation();
            $(this).tooltip('hide');
        }
});

工具提示正确显示,但是当我将光标从其中一个图标移开时(显然会触发工具提示上的“隐藏”事件),模态“隐藏”事件也会触发,我们的页面重新加载!

我还在调查我们的代码中是否还有其他东西在干扰这里,但是想把它放在这里,看看你们中的任何一位SO工匠是否会发现我错过的东西。

0 个答案:

没有答案