Javascript 如何使jQuery Beauty提示在光标停留在工具提示文本上时保持打开状态？

我正在使用（也在使用），我希望在工具提示文本中显示href链接，并允许用户单击该链接

但是，一旦我们离开锚点，toottip文本就会在超时后消失（我们可以定义）

因此，只要用户光标位于锚点或工具提示文本上，我就希望工具提示文本保持打开状态

我该怎么做呢？可能吗？我尝试过，但没有成功，比如：

$('.bt').bt({
postShow: function(box) {
  $(".bt-content").hoverIntent({
    timeout : 500,
    over: function() {
      $(".bt-wrapper").show(); //or $(".bt-active").btOn();
    }
  });
}
})

---

这是迄今为止我所能做的最好的： 在提示的选项中添加这些代码

trigger: ['mouseenter','click'],
postShow: function(box){
  var that = this;
  $(box).bind('mouseleave',function() {
     that.btOff();
  });
},

---

它可以工作（至少在Firefox上），但我更喜欢使用hoverintent。

这是目前为止我能做的最好的： 在提示的选项中添加这些代码

trigger: ['mouseenter','click'],
postShow: function(box){
  var that = this;
  $(box).bind('mouseleave',function() {
     that.btOff();
  });
},

---

它可以工作（至少在Firefox上），但我更喜欢使用hoverintent。

您好，感谢Chris Cinelli的上述回复。然而，上述解决方案的问题是，当我们移出锚定时，工具提示仍然存在，只有在页面外单击一次才会触发其关闭

然而，这种行为似乎不恰当，因为如果鼠标悬停时弹出工具提示，那么在鼠标悬停时也应该消失（如果行为是在鼠标悬停时定义的）

因此，为了实现这种行为，我对chris cinelli提供的解决方案做了额外的更改

解决方案：

我已经为外部容器定义了一个虚拟类toolTipRange，在该容器中弹出窗口的外观是有效的，并在post show事件中添加了以下代码

$（“.toolTipRange”）.bind（'mouseleave'，函数（事件）{
如果（event.relatedTarget.nodeName！=“CANVAS”）{
that.btOff（）；
}

---

});

您好，感谢Chris Cinelli的上述回复。然而，上述解决方案的问题是，当我们移出锚定时，工具提示仍然存在，只有在页面外单击一次才会触发其关闭

然而，这种行为似乎不恰当，因为如果鼠标悬停时弹出工具提示，那么在鼠标悬停时也应该消失（如果行为是在鼠标悬停时定义的）

因此，为了实现这种行为，我对chris cinelli提供的解决方案做了额外的更改

解决方案：

我已经为外部容器定义了一个虚拟类toolTipRange，在该容器中弹出窗口的外观是有效的，并在post show事件中添加了以下代码

$（“.toolTipRange”）.bind（'mouseleave'，函数（事件）{
如果（event.relatedTarget.nodeName！=“CANVAS”）{
that.btOff（）；
}

---

});

这是可能的。以下解决方案使用jQuery1.7和HoverIntentR5。我在Chrome、Safari、FF3.7、FF7和IE8中测试了它

$('.bt').bt({
    postShow: function(box) {
        $(box).hoverIntent({
            over: function() {
                    $(this).data('hasmouse', true);
            },
            out: function() {
                    $(this).data('hasmouse', false);
                    $(box).hide();
            },
            timeout: 300,
        });
    },
    hideTip: function(box, callback) {
        if ($(box).data('hasmouse')) {
            return;
        }
        $(box).hide();
        callback(); 
    },
});

---

我再次在BeautyTip框中使用了hoverIntent来设置一个标志（“data hasmouse”），指示鼠标光标是否仍悬停在工具提示上。只要设置了标志，新的hideTip方法就不会执行任何操作。相反，BeautyTip框在其自身的“hoverIntent out”触发时隐藏。

这是可能的。以下解决方案使用jQuery1.7和HoverIntentR5。我在Chrome、Safari、FF3.7、FF7和IE8中测试了它

$('.bt').bt({
    postShow: function(box) {
        $(box).hoverIntent({
            over: function() {
                    $(this).data('hasmouse', true);
            },
            out: function() {
                    $(this).data('hasmouse', false);
                    $(box).hide();
            },
            timeout: 300,
        });
    },
    hideTip: function(box, callback) {
        if ($(box).data('hasmouse')) {
            return;
        }
        $(box).hide();
        callback(); 
    },
});

我再次在BeautyTip框中使用了hoverIntent来设置一个标志（“data hasmouse”），指示鼠标光标是否仍悬停在工具提示上。只要设置了标志，新的hideTip方法就不会执行任何操作。相反，BeautyTip框在其自身的“hoverIntent out”触发时被隐藏