Javascript 引导工具提示在悬停时保持打开状态

我在我的网页上设置了引导工具提示。当你翻滚一个图像时，工具提示会出现，在工具提示里面我有一个链接，当我翻滚工具提示点击链接时。。。它消失了

我的问题（奇怪的是，我似乎在任何地方都找不到答案）是，当我将鼠标悬停在工具提示上时，如何让工具提示保持打开状态

我已经看到并尝试了一些可以设置延迟的解决方案，但我不想这样做，因为我不喜欢这种效果

---

任何帮助都会很好，谢谢

试试这个。这可能会有所帮助

var originalLeave = $.fn.tooltip.Constructor.prototype.leave;
$.fn.tooltip.Constructor.prototype.leave = function(obj){
  var self = obj instanceof this.constructor ?
    obj : $(obj.currentTarget)[this.type](this.getDelegateOptions()).data('bs.' + this.type)
  var container, timeout;

  originalLeave.call(this, obj);

  if(obj.currentTarget) {
    container = $(obj.currentTarget).siblings('.tooltip')
    timeout = self.timeout;
    container.one('mouseenter', function(){
      //We entered the actual popover – call off the dogs
      clearTimeout(timeout);
      //Let's monitor popover content instead
      container.one('mouseleave', function(){
        $.fn.tooltip.Constructor.prototype.leave.call(self, self);
      });
    })
  }
};


$('body').tooltip({ selector: '[data-toggle]', trigger: 'click hover', placement: 'bottom auto', delay: {show: 50, hide: 400}});

tooltip-trigger="focus manual"

我是这样做的

我正在触发链接上的工具提示-因此必须将a替换为相关元素：

初始化工具提示：

    $(document).ready(function() {
      $('a').tooltip();
    })

保持鼠标悬停时工具提示打开+在第一次鼠标悬停时添加一个助手类（在我的情况下，工具提示总是触发两个鼠标悬停事件-因此我必须确保只在第一次尝试时添加.active）

当鼠标移出时隐藏相应的工具提示。。。这将使用工具提示内部来触发，因为工具提示的小箭头（仍然属于.tooltip）可能导致以下情况：您可能会用光标离开工具提示，但距离不够远，然后工具提示将保持打开状态

    $(document).on('mouseout','.tooltip-inner', function() {
      $('a.active').tooltip('hide').removeClass('active');
    });

我就是这么做的

  $(document).ready(function () {
        $('[data-toggle="tooltip"]').tooltip({
            trigger: "manual"
        });

        $('body').on('mouseleave', '.tooltip', function () {
            $('[data-toggle="tooltip"]').tooltip('hide');
        });

        $('[data-toggle="tooltip"] > i').on('mouseenter', function () {
            $('[data-toggle="tooltip"]').tooltip('show');
        });

        $('[data-toggle="tooltip"]').on('click', function () {
            $(this).tooltip('show');
        }); });

$（文档）.ready（函数（）{
$（文档）.on（“鼠标悬停”，“我的链接”，“事件）=>{
$（event.target）。工具提示(
{
触发器：“手动”，
延迟：{“隐藏”：500}
}).工具提示（“显示”）；
});
var isOver=假；
$（文档）。在（“mouseleave”，“\myLink”、（事件）=>{
setTimeout（函数（）{}，1000）；
如果（！isOver）
setTimeout（函数（）{$（'#myLink'）。工具提示（'hide'）；}，500）；
});
$（文档）.on（“鼠标悬停”，“工具提示”，“事件）=>{
isOver=真；
});
$（document）.on（“mouseleave”、“.tooltip”、（event）=>{
setTimeout（函数（）{$（'#myLink'）。工具提示（'hide'）；}，500）；
});
});

引导示例
这对我很有用：

$('[data-toggle="tooltip"]').tooltip({
    trigger: "manual"
});

$('[data-toggle="tooltip"]').on('mouseleave', function () {
    $(this).tooltip('hide');
});

$('[data-toggle="tooltip"]').on('mouseenter', function () {
    $(this).tooltip('show');
});

$('[data-toggle="tooltip"]').on('click', function () {
    $(this).tooltip('hide');
});

不确定它是否符合你的需要，但这正是府绸的用途。你可以触发那些悬停等等。我也在考虑用一个popover来代替工具提示。另一个选项是尝试延迟选项，请参见？它可能会将工具提示打开足够长的时间，以便单击链接。请参见此链接：[how-can-i-hold-twitter-bootstrap-popover-open-until-my-mouse-moves-into-It][1]：希望有帮助。太棒了。完全按照预期工作->现在使其成为工具提示上的可配置选项（使用数据延迟作为HTML选项卡+对象上的选项）。以前从未以这种方式扩展引导对象。你有时间来调整答案吗？如果没有-我可以做一些研究并将其包括在内。我建议通过
container=$（'#'+$（obj.currentTarget.attr（'aria-descripeby'））获取工具提示容器。这样，它还可以与
.tooltip（{container:'body'}）
结合使用，这通常是用来避免由于相对定位而出现问题的）？此外，根据，手动
不应与任何其他选项结合使用。手动控制似乎是实现这一点的最佳方式。我还将触发器的容器添加到
mouseleave
函数中，这样即使用户从未将光标移动到工具提示本身的顶部，工具提示也会隐藏。
$('[data-toggle="tooltip"]').tooltip({
    trigger: "manual"
});

$('[data-toggle="tooltip"]').on('mouseleave', function () {
    $(this).tooltip('hide');
});

$('[data-toggle="tooltip"]').on('mouseenter', function () {
    $(this).tooltip('show');
});

$('[data-toggle="tooltip"]').on('click', function () {
    $(this).tooltip('hide');
});