6

我正在使用jquery-1.9.1.js和 UI jquery-ui-1.10.3.custom.min.js。当我将鼠标悬停在任何表单元素上时，它会显示工具提示并在鼠标移出时消失。但是我想在该项目的单击事件上消失该工具提示，因为在我当前的情况下，它显示按钮的工具提示，即使在单击按钮后它仍然存在。因此它会在页面上看到多个工具提示。点击后我需要立即隐藏它们。（下面是屏幕截图）。

在此处输入图像描述

我使用了下面的代码，但对我不起作用

 $(document).click(function() {
       $(this).tooltip( "option", "hide", { effect: "explode", duration: 500 } );
        });

如何解决这个问题请帮忙。

编辑

我正在使用更新面板。这会产生问题吗？

4

6 回答 6

8

根据 jQueryUI 文档，您的代码只会更改它的关闭方式。你想要的是close http://api.jqueryui.com/tooltip/#method-close。

但是，您可能需要稍微更改代码才能使其正常工作。从您的代码来看，您使用委托（允许其他东西为您的项目制作工具提示），而不是将其直接应用于您的项目。根据文档 close 不适用于委派的工具提示。

你会想要类似的东西

$('.editButtons').tooltip().click(function() {
    $('.editButtons').tooltip( "close");
})
于 2013-07-24T11:50:41.610 回答
5

关闭委托工具提示的丑陋黑客（最后一个打开）

$('div[id^="ui-tooltip-"]:last').remove();
于 2014-05-07T22:09:16.307 回答
2

可能是一个肮脏的黑客，但你不能通过使用“ui-tooltip”选择它来隐藏它自己的工具提示元素，它是应用于工具提示容器的类。

$('body').on("click","element_selector",function(event){
$('.ui-tooltip').hide();
});

您应该用适合您元素的选择器替换“element_selector”。

于 2015-10-01T15:34:24.427 回答
2

我知道这是一个老问题，但我遇到了同样的问题并使用以下方法来解决它。

假设您使用它来启动工具提示：

$('[data-toggle="tooltip"]').tooltip();

单击后，以下内容会淡出工具提示。淡入淡出之后，它会从 DOM 中移除（否则您最终可能会得到很多隐藏的工具提示）。

$('[data-toggle="tooltip"]').click(function() {
    $('.tooltip').fadeOut('fast', function() {
        $('.tooltip').remove();
    });
});

希望这对某人有帮助！

于 2016-03-21T09:37:13.007 回答
1

我在使用 jq 1.12 时采用了一种稍微不同的方法，在显示新的 ui-tooltips 时隐藏了所有的 ui-tooltips。这是在 Chrome 和 IE 11 和 IE 11 中测试的（ie8 仿真通过 http-equiv="X-UA-Compatible" content="IE=8"）

$.widget("ui.tooltip", $.ui.tooltip, {
    options: {
        content: function () {
            $(".ui-tooltip").fadeOut(); /* tooltip genocide */
            return $(this).prop('title');
        },
        show: {
            effect: "fade",
            delay: 750
        }
    }
});

hth

于 2016-08-22T16:27:20.320 回答
-2 
$(document).click(function() {
    $(this).tooltip( "option", "hide", { effect: "explode", duration: 500 } ).off("focusin focusout");
});
于 2014-09-23T09:35:12.130 回答