你如何制作一个“粘性”提示提示，点击时打开，点击提示本身之外的点击关闭？答案

【问题标题】：How do you make a 'sticky' cluetip that opens on click, close on a click outside of the tip itself?你如何制作一个“粘性”提示提示，点击时打开，点击提示本身之外的点击关闭？
【发布时间】：2011-10-20 01:49:08
【问题描述】：

我有一个提示，它设置为粘性并在单击链接时打开。我还在线索提示上设置了一个关闭按钮，所有这些都很好用。如果除了当前的关闭按钮之外，有人在提示提示之外单击，我想关闭提示提示。我正在寻找悬停解决方案，只需在提示提示之外单击即可关闭。

【问题讨论】：

标签： jquery cluetip

【解决方案1】：

我是这样做的：

    onShow: function() {
        // close cluetip when users click outside of it
        $(document).click(function(e) {
            var isInClueTip = $(e.target).closest('#cluetip');
            if (isInClueTip.length === 0) {
                $('.cluetip-default').hide();
            }
        })
    },

【讨论】：

【解决方案2】：

根据FAQ，有一个API方法可以让你触发关闭：

线索提示 1.0.3 的新内容：如何以编程方式关闭（隐藏）线索提示？如果要触发一个线索提示关闭，基于其他一些交互，可以使用如下代码：$(document).trigger('hideCluetip');

所以我认为你可以这样做：


$('#myCluetip').cluetip({
  onShow: function() {
    $(document).one('mousedown',function() {
      $(document).trigger('hideCluetip');
    })
  });
});

这通过将 mousedown 事件的一次性事件处理程序绑定到文档正文来工作，然后触发 Cluetip 人员所说的将隐藏打开的 Cluetips 的事件。使用一次性事件处理程序意味着您不会在每次有人点击某物时都发送 hideCluetip 触发器。

【讨论】：

我最终采用了使用 hideClueTip 的概念，但通过 onShow 和 onHide 挂钩绑定和取消绑定 mouseup 的事件，具体取决于点击是否在提示中（我决定在点击时关闭提示小费之外）。
@mornos - 你能发布你的解决方案吗？

【解决方案3】：

Stony 的解决方案对我不起作用。

我使用了@Gary Green 的解决方案，它工作正常 - 但这仍然不是我想要的确切的“鼠标悬停/悬停”解决方案。

最后，我发现 Cluetip 本身提供了一种方法来做到这一点。

只需设置值 "mouseOutClose: false" ，如下所示：

$("#myForm :input").cluetip(
    {
        sticky: true, 
        closePosition: 'title', 
        arrows: true,
        mouseOutClose: true
    }
);

【讨论】：

只是添加，你需要添加sticky选项，mouseOutClose才能工作。

【解决方案4】：

查看您的代码会很有帮助，但无论如何您都可以按照这些思路做一些事情；

$(document).click(function(e) {
    if (!$(e.target).hasClass('cluetip'))
    {
      // Close the cluetip here.  
    }
});

【讨论】：