jQuery：如何删除醉酒的工具提示？答案

【问题标题】：jQuery: How to remove the tipsy tooltip?jQuery：如何删除醉酒的工具提示？
【发布时间】：2010-08-10 13:16:24
【问题描述】：

我使用 .placeTaken 类将醉酒工具提示添加到 div。然后用户可以拖动框，因此我删除了该类并将其添加到新的 div 中。发生这种情况时，我向该 div 添加了一个新的提示工具提示，并且效果很好，但我想删除旧的提示。

他们说如果您希望通过将 title 属性设置为空字符串来删除工具提示，请改为设置 original-title 属性。我试过$("#"+dropFromId).attr("original-title", "");，但工具提示仍然存在。我什至无法通过设置另一个 original-title 来更改工具提示标题。

我做错了什么？

编辑：我想我没有给你们足够的信息。我使用 ajax 来获取从数据库中获取的位置。 PHP 返回一个关联数组（客户），然后我在 JavaScript 中使用该数组，其中发生的位置与名称匹配。放置时所占用的位置会发生变化，因此我再次执行 ajax 函数以使用所有已占用的位置更新数组。首先，我将醉酒的工具提示添加到所有拍摄的地方，像这样

$("#map div.placeTaken").tipsy({gravity: 'w', html: true, fade: true, title:
    function(){
        // id could for example be map74, substring to 74
        var id = $(this).attr("id").substring(3,6);
        return '<div>'+customers[id]+'</div><br />';
    }
});

所以标题等于数组中的那个位置。我希望我解释得足够好。当盒子被放到一个新的地方时，会发生这种情况

$("#map div span").bind( "dragstop", function(event, ui) {
        // some code here to change the .placeTaken class       
        // update database with the new place
        $.ajax({
            type: "POST",
            url: "map.php",
            data: "dropFromId="+ dropFromId.substring(3,6) +"& dropToId="+ dropToId.substring(3,6),
            success: function(){
            // ajax function to update the js array with new places
            customerTooltip(); 
            }
        });

        // on this place, add tooltip
        $("#"+dropToId).tipsy({gravity: 'w', html: true, fade: true, title:
            // funktion för att avgöra vilken title som ska användas
            function(){
                var id = dropToId.substring(3,6);
                return '<div>'+customers[id]+'</div><br />';
            }
        });
    }   
});

这一切都很好，所以我认为我只需将 dropFromId 标题更改为 "" 在 drop 上，以便我将其删除。

【问题讨论】：

你能提供一些显示问题的示例代码吗？
您也应该发布您的 html，因为工具提示来自 title 属性，除非您使用一些自定义属性。

标签： jquery tooltip

【解决方案1】：

$("#"+dropFromId)[0].setAttribute('original-title', '')

【讨论】：

这个是正确的，也是醉酒作者在onehackoranother.com/projects/jquery/tipsy/#options提出的方法
那是正确的，应该是最好的答案。

【解决方案2】：

如果您不想再显示醉意，只需在元素上使用.tipsy('disable')。

如果您正在使用trigger: manual 并且想要隐藏它，您只需删除主体上的.tipsy div。

还有disableenable和toggleEnabled

【讨论】：

【解决方案3】：

我使用更简单的方法：

$('body').find('.tipsy').each(function(){
    $(this).remove();
});

【讨论】：

【解决方案4】：

去除醉意最简单的方法；

$('.tipsy:last').remove();

【讨论】：

非常方便，如果您有一个分配了醉酒的按钮，鼠标悬停在按钮上 → 会出现醉酒工具提示，然后单击该按钮，醉酒会被上面的代码隐藏。谢谢！

【解决方案5】：

使用 $(".tipsy").remove(); 似乎可以解决问题，因为在显示工具提示时，带有 tipsy 类的 div 会附加到文档的正文中。

请确保您不要在其他地方使用 tipsy 类（即，将您的工具提示称为 toolTip 之类的东西）

【讨论】：

【解决方案6】：

$("#tipsyfiedElement").unbind('mouseenter mouseleave'); // Or whatever event trigger the tiptool

【讨论】：

【解决方案7】：

我最近遇到了这个问题，我是这样解决的：

使用它来将 original-title 属性设置为 'stop'：

$('.myElement').attr('original-title','stop');

然后，在 jquery.tipsy.js 中，将代码更改为以下内容：

...
} else if (typeof opts.title == 'function') {
    title = opts.title.call(this);
}

if (title != 'stop') {    //line 32
    ...
    ...
}                         //line 62
...

在我的版本 (0.1.7) 中，添加的代码从第 32 行开始，在第 62 行结束括号。Tipsy 应该看到您的标题属性等于“停止”并且不会尝试打开工具提示。

此外，这会向控制台输出一些错误。它没有任何区别，但是如果您想摆脱它，请在第 73 行添加它（添加之前的代码之后）

try { tip.remove(); } catch(err){}

战俘

【讨论】：

【解决方案8】：

使用：.unbind('mouseenter mouseleave'); 删除一个醉酒的方法。

【讨论】：

【解决方案9】：

由于触摸/点击事件的复杂性，特别是在 iPad 上，我在谷歌上搜索了在移动设备上禁用 Tipsy 的情况后看到了这个问题。

我决定实施的解决方案是在 jquery.tipsy.js 文件的顶部添加一个小测试。

要在触控（移动）设备上禁用 Tipsy： var deviceAgent = navigator.userAgent.toLowerCase();

var isTouchDevice = Modernizr.touch ||
(deviceAgent.match(/(iphone|ipod|ipad)/) ||
deviceAgent.match(/(android)/) ||
deviceAgent.match(/(iemobile)/) ||
deviceAgent.match(/iphone/i) ||
deviceAgent.match(/ipad/i) ||
deviceAgent.match(/ipod/i) ||
deviceAgent.match(/blackberry/i) ||
deviceAgent.match(/bada/i));

function Tipsy(element, options) {
    this.$element = $(element);
    this.options = options;
    this.enabled = !isTouchDevice;
    this.fixTitle();
};

See: The best way to detect if user agent supports touch

【讨论】：