无需悬停鼠标即可显示工具提示答案

【问题标题】：Appearing tooltip without hovering mouse无需悬停鼠标即可显示工具提示
【发布时间】：2023-03-25 01:02:01
【问题描述】：

在下面的代码中，将鼠标悬停在“悬停鼠标”文本上时会出现工具提示。

<!DOCTYPE html>
<html>
<body>

<p title="this is tooltip">hover your mouse</p>

</body>

有没有什么方法可以使用 JavaScript 在不悬停鼠标的情况下显示工具提示？假设页面加载完毕，我们希望显示按钮的工具提示 5 秒，然后再次隐藏工具提示。

这是我尝试过的（基于下面的答案）至少在没有鼠标悬停的情况下显示工具提示，但对工具提示没有任何作用

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
</head>
<body>
<p title="this is tooltip" id="my-hover">hover your mouse</p>
<script>


    setTimeout(function () {
        $('#my-hover').trigger('mouseover');
    }, 1000);

</script>
</body>
</html>

【问题讨论】：

这个问题似乎离题了，因为它缺乏足够的信息来诊断问题。更详细地描述您的问题或在问题本身中包含一个最小示例。
你是认真的吗？那么将其作为工具提示有什么意义呢？
@sree 我的按钮旁边没有空间来显示文本或 div 等。我需要为此使用工具提示。
@HashemQolami 这就是你所能提供的？
@Cgraphics 绝对不是，但是由于缺乏足够的信息，有很多可能性

标签： javascript jquery html css hover

【解决方案1】：

<p title="this is tooltip" id="my-hover">hover your mouse</p> 
    setTimeout(function () {
                $('#my-hover').trigger('mouseover');
            }, 10); 

    $('#my-hover').mouseover(function () {
         setTimeout(function () {
            $('#my-hover').show();}, 500);   

    });

此代码将自动触发鼠标悬停事件。

【讨论】：

他们不想隐藏段落。他们想要显示工具提示（当你将鼠标悬停在它上面时得到的）五秒钟，然后隐藏它。该段落仍应始终可见。
这是用户想要的。用户要求一个可以使工具提示出现然后消失的系统。 +1 为卡普坦。好答案。 :)
@AbdurRahim 不，这不是我想要的！我不想隐藏段落！我想在页面加载后显示工具提示 5 秒然后隐藏工具提示（我清楚地说工具提示）

【解决方案2】：

试试这个

$('element').trigger('mouseover');

这是基于脚本的

【讨论】：

不起作用。也不确定 cert-small 来自哪里，因为这不是问题中 HTML 的一部分。
我更新答案你必须把你的元素 cert-samll 是例子
你也必须使用tooltip javascript stackoverflow.com/questions/543277/…
我知道cert-small 是一个例子，我只是不知道你为什么选择它作为例子。即使使用有效的元素选择器，您的问题中的代码不起作用。
我在我的网站 cert-small 中测试代码并在 firebug 中运行此代码，如果您想发送 url 并在 firebug 中进行测试，请提供反馈

【解决方案3】：

你可以使用 jquery UI Tooltip

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <script type="text/javascript" src="js/vendor/jquery-1.10.2.min.js"></script>
        <script type="text/javascript" src="js/jquery-ui-1.10.4.custom.min.js"></script>
        <link rel="stylesheet" href="css/ui-lightness/jquery-ui-1.10.4.custom.min.css" />

        <title>Test</title>
    </head>
    <body>
        <p title="this is tooltip" id="tooltip">hover your mouse</p>

        <script type="text/javascript">
            $( "#tooltip" ).tooltip({ content: "this is tooltip" }).tooltip("open");
            setTimeout(function () { $("#tooltip").tooltip("close");}, 5000);
        </script>  
   </body>
</html>

【讨论】：

什么意思：“什么都不做……”？