在加載時顯示引導工具提示，並在幾秒鍾后自動隱藏

Question

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

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

這是在頁面加載時顯示工具提示，但是如何在幾秒鍾后將其隱藏？

我嘗試過這樣的事情

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

jsfiddle

Answer 1

延遲實際上會影響所選觸發方法（默認為懸停）顯示工具提示的延遲。 您需要將觸發器設置為手動，然后才能在頁面加載時觸發它，並設置一個超時，該超時將在以后隱藏。 這樣的事情應該起作用：

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

有關更多信息，請參見此處的文檔： http : //getbootstrap.com/javascript/#tooltips

Answer 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);
    });
});