Question

我想禁用jqueryui工具提示，专注于输入和选择元素。但只针对重点元素。所有其他元素应在悬停时显示工具提示。在模糊时，应启用元素的工具提示。

现在我有：

var TheTooltip = $( document ).tooltip({
              items: ".tooltip"
              }
        }).on('focus', 'input, select', function() {
            TheTooltip.tooltip("close").tooltip("disable");
        }).on('blur', 'input, select', function() {
            TheTooltip.tooltip("open").tooltip("enable");
        });

但这会禁用网站上的所有工具提示。如果我将TheTooltip更改为$（this），我会收到一条错误消息。

Answer 1

你有什么工作，但有一个更简单的方法来使用jQuery的默认选择器（:not和:focus）：

$(document).tooltip({
    items: ".tooltip:not(:focus)"
});

Here's a jsfiddle demo

如果您想使用工具提示的打开/关闭功能，请shouldn't delegate them。您对focus和blur事件处理程序有正确的想法：

$(".tooltip").tooltip();
$(".tooltip").focus(function(evt) {
    // evt.currentTarget === this, unless you use $.proxy
    $(evt.currentTarget).tooltip("close");
});

Here's an update

这可能比操纵input的类更复杂但更脆弱;如果非委托工具提示是一个选项

，我仍然建议你去做

Answer 2

这将使工具提示仅在悬停时显示。

$(document).tooltip({
    items: ":hover"
});

Answer 3

这是我的工作解决方案。如果有更简单的方法，你可以告诉我。

        $( document ).on('focus', 'input.tooltip, select.tooltip', function() {
            $(this).removeClass("tooltip").addClass("hadtooltip");
            $(this).tooltip().tooltip("close");
        }).on('blur', 'input.hadtooltip, select.hadtooltip', function() {
            $(this).addClass("tooltip").removeClass("hadtooltip");
        });

禁用焦点上的jquery工具提示

3 个答案: