使用 qtip 时隐藏 div答案

【问题标题】：Hide div when using qtip使用 qtip 时隐藏 div
【发布时间】：2020-01-31 03:49:28
【问题描述】：

也许这是一个愚蠢的问题，但是......当 html 加载时隐藏 div 然后通过 qTip 显示它的方法是什么？我试图用$(div).hide 和<div style="display: none;"> 隐藏它，但是qtip 不起作用。

更新

.js 中的代码

$('#usuario').qtip({
    content: $(this).next(),
    show: 'click',
    hide: 'unfocus'
});

html中的代码

<span id='usuario_menu'>
            <a id="usuario" ><?php echo $_SESSION['correo']; ?></a>
            <div class="hidden">
                <a href="php/login_out.php">Cerrar sesión</a><br/>
                <a href="">Otra cosa</a>
            </div>
            <img src='' alt="Tareas pendientes">
        </span>

【问题讨论】：

请出示一些代码。
How to apply qTip in div content?的可能重复

标签： jquery html qtip qtip2

【解决方案1】：

已解决 答案在这方面的 cmets 中：
jQuery qTip: How to attach a single tooltip div to multiple target divs?

但是，如果有其他人回答，欢迎他们:)

【讨论】：

【解决方案2】：

当我没有得到 qtip 工作的隐藏元素方法并且在这里没有得到答案时，我偶然发现了这个问题，我将在解决问题后发布一些工作代码。仅供他人查阅。

您的问题是您的 js 代码中的 $(this)。可以用$("#usuario")换货。如果您在 div 中使用“隐藏”类，则应通过对此类应用 css 规则来隐藏它：.hidden{ display:none; }。你的其余代码没问题，我只是将你的 php 代码更改为“测试”，因为我不使用你的服务器:-)。

这里是代码：

<head>
<link type="text/css" rel="stylesheet" href="jquery.qtip.css" />
</head>
<body>
<span id='usuario_menu'>
            <a id="usuario" >test</a>
            <div class="hidden">
                <a href="php/login_out.php">Cerrar sesión</a><br/>
                <a href="">Otra cosa</a>
            </div>
            <img src='' alt="Tareas pendientes">
        </span>
</body>

<style>
.hidden{ display:none; }
</style>

<script type="text/javascript" src="jquery-3.4.1.js"></script>
<script type="text/javascript" src="jquery.qtip.js"></script>
<script>
$('#usuario').qtip({
content: $("#usuario").next(),
show:'click',
hide:'unfocus'
});
</script>

必须将文件 jquery.qtip.css、jquery-3.4.1.js、jquery-3.4.1.js 包含在与上述 html 文件相同的目录中，才能运行。你可以试试自己的小提琴：https://jsfiddle.net/Lf6s9um4/。只需点击“测试”一词即可。

当然这不是最好的解决方案，如果你想使用许多隐藏的许多 div 并使用它们来显示工具提示。然后你应该在 qtip2 指南http://qtip2.com/guides 中查找“隐藏元素”。

【讨论】：