加载时显示引导工具提示并在几秒钟后自动隐藏答案

【问题标题】：show bootstrap tooltip on load and auto hide after few seconds加载时显示引导工具提示并在几秒钟后自动隐藏
【发布时间】：2017-06-01 01:34:28
【问题描述】：

<a title="show on load" data-toggle="tooltip">Hello world</a>

 $('a').tooltip('show');

这是在页面加载时显示工具提示，但几秒钟后如何隐藏它？

我试过这样的，

$('a').tooltip({
   'delay': { show: 'show', hide: 3000 }
});

jsfiddle

【问题讨论】：

标签： javascript jquery twitter-bootstrap tooltip

【解决方案1】：

延迟实际上会影响所选触发方法显示工具提示的延迟，默认为悬停。您需要将触发器设置为手动，然后您可以在页面加载时触发它并设置稍后隐藏的超时。像这样的东西应该可以工作：

$('p').tooltip({
   trigger: 'manual'
});
$(document).ready(function() {
    $('p').tooltip('show');
    setTimeout(function(){ $('p').tooltip('hide'); }, 3000);
});

有关更多信息，请参阅此处的文档：http://getbootstrap.com/javascript/#tooltips

【讨论】：

【解决方案2】：

感谢Chip Dean。

或者使用这个：

$(document).ready(function(){
   $('p').tooltip().mouseover();
   setTimeout(function(){ $('p').tooltip('hide'); }, 3000);
});

数据切换

$(document).ready(function(){
   $('[data-toggle="tooltip"]').tooltip().mouseover();
   setTimeout(function(){ $('[data-toggle="tooltip"]').tooltip('hide'); }, 3000);
});

或

  // $(window).load(function(){  //  deprecated in 1.8 - removed 3.0.
$(window).on("load", function(){
    $('[data-toggle="tooltip"]').tooltip().mouseover();
    setTimeout(function(){ $('[data-toggle="tooltip"]').tooltip('hide'); }, 3000);
});

滚动显示

$(document).ready(function(){
    $(window).on("scroll", function(){
       $('[data-toggle="tooltip"]').tooltip().mouseover();
       setTimeout(function(){ $('[data-toggle="tooltip"]').tooltip('hide'); }, 3000);
    });
});

【讨论】：