用于工具提示的 Jquery if else 语句答案

【问题标题】：Jquery if else statment for tooltip用于工具提示的 Jquery if else 语句
【发布时间】：2014-01-08 03:04:08
【问题描述】：

当您将鼠标悬停在链接上时，我会显示一个工具提示。如果您将鼠标悬停在它上面（因为其中有链接等），我希望工具提示保持不变，或者如果您将鼠标从链接上移开，它就会消失。我尝试了几件事，但还没有弄清楚。这是我第一次用 jQuery 构建任何严肃的东西。

下面的内容是 .hover() 'handlerOut' 事件中的内容。

if($(this.a).mouseout())
{
    if ($('.tip_container').hover()) {
        $('.tip_container').css('display', 'block');
        $('.tip_container').mouseleave(function() {
        $('.tip_container').remove(0);
    });
} else if ($('.tip_container').hover() == false && $(this.a).mouseoff() == true)
    {
        $('.tip_container').remove(0);
    }
}
>>"this.a" refers to the link<<

有了这个和我尝试过的其他东西，除非你将鼠标悬停在它上面，否则工具提示不会消失。我也试过了

else if (!$('.tip_container').hover() && $(this.a).mouseoff()) {

可以有多个条件吗？

代码的主要思想是，如果您将鼠标移开链接“this.a”，则工具提示将通过以下方式删除：

$('.tip_container').remove(0);

但如果您将鼠标悬停在工具提示上，则在您将鼠标移出工具提示之前，它不会被移除。

【问题讨论】：

我觉得你需要re-read the jQuery documentation about the "hover" method.
if ($('.tip_container_').hover()) {...} 确实有效，但是当您添加多个事件时它不会。

标签： javascript jquery html if-statement tooltip

【解决方案1】：

你有小提琴或任何东西要演示吗？

可能是这样的

$(this, '.tip_container').hover(function () {
        $('.tip_container').show();
  }, function () {
        $('.tip_container').hide();
  }
);

基本上将链接和工具提示元素都绑定到悬停方法，该方法在 mouseenter/mouseleave 上隐藏/显示工具提示元素。在 cmets 中发布的 Pointy 链接是一个很好的起点

【讨论】：

我不能轻易做出小提琴，因为它是我正在制作的 chrome 扩展的一部分，它依赖于它修改后的网站。对不起。
很遗憾没有。感谢您的尝试！
啊！我想我误解了你的例子 - 编辑了我的答案
我想这就是你的意思，但它不起作用。

【解决方案2】：

经过一夜好眠并忽略了一段时间后，我想出了一个解决方案。这是我在悬停 handlerOut 事件中添加的内容。

 var timer;

 timer = setTimeout(function() {
           $('.tip_container').remove();
       }, 500);                     
           $( '.tip_container' ).hover(
       function() {
           clearTimeout(timer);
           $('.tip_container').css('display', 'block');
       }, function() {
           $('.tip_container').remove();
       }
    );

当鼠标悬停在链接外时，它会在执行删除之前等待，如果鼠标悬停在工具提示上，它将清除计时器并将工具提示设置为阻止以使其保持显示，然后在鼠标悬停在工具提示之外时，它将被删除。

【讨论】：