Question

我想显示一个工具提示，它将在3秒后消失。

我应该如何修改我的代码？似乎评论的代码不起作用：

HTML

<div id="mytooltip" title="the message"></div>

JS

$(function() {
    $('#mytooltip').tooltip();

    $('#mytooltip').tooltip({
    open: function(e,o){
        $(o.tooltip).mouseover(function(e){
            $('#mytooltip').tooltip('close');
        });
        $(o.tooltip).mouseout(function(e){
        });         
    },
    close: function(e,o) {},
    show: { duration: 800 }
});

    $('#mytooltip').tooltip('open');//.delay(2000).tooltip('close');


});

Answer 1

你可以这样做：

$(function () {
    $('#mytooltip').tooltip();

    $('#mytooltip').tooltip({
        open: function (e, o) {
            $(o.tooltip).mouseover(function (e) {
                $('#mytooltip').tooltip('close');
            });
            $(o.tooltip).mouseout(function (e) {});
        },
        close: function (e, o) {},
        show: {
            duration: 800
        }
    });

    $('#mytooltip').tooltip('open');
    setTimeout(function () {
        $('#mytooltip').tooltip('close'); //close the tooltip
    }, 3000); //but invoke me after 3 secs
});

Fiddle.

Answer 2

这与 Bootstrap 4 工具提示完美配合

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

工具提示会在 3 秒后自动出现和消失。

我知道这个问题已经问了 7 年了，但可能仍然对某人有帮助！

jquery工具提示设置超时

2 个答案: