Jquery - 工具提示不起作用答案

【问题标题】：Jquery - Tooltip not workingJquery - 工具提示不起作用
【发布时间】：2017-03-16 15:30:03
【问题描述】：

我在工具提示上找到了一个教程，我试图复制它而不看它。在我这样做之后，我发现我的代码和教程存在一些差异。所以我修复了它，但它仍然没有显示。

没关系，我发现了问题。

改变了

  tip = $(this).find('.tooltip');

为

  tip = $('.tooltip');

成功了

【问题讨论】：

【解决方案1】：

您的选择器错误：

tip = $(this).find('.tooltip');

这会在您的锚点中查找具有“工具提示”类的元素。只需使用：

var tip = $('.tooltip');

【讨论】：

这会导致页面上出现多个工具提示。
没错。我只是指出他的脚本不起作用的原因是由于选择器错误。就支持多个工具提示而言，有很多方法（包括您的答案——如果您的工具提示不在触发器旁边，则会中断）。您可以强制执行基于类名的关联、使用 data() 或基于标记的关系。

【解决方案2】：

要保留每个链接，您需要替换它：

$(this).find('.tooltip')

使用查找工具提示的方法是一个兄弟，而不是 inside <a>，像这样：

$(this).next('.tooltip')

【讨论】：

这几乎就是我所做的，但是如果我通过链接移动它，框不会跟随鼠标。
@Baruch - 因为您正在使用mouseover 事件，如果您想要更新它，您需要mousemove 事件，如下所示：jsfiddle.net/8RTqC/3
哦！这就是为什么。谢谢尼克。

【解决方案3】：

你最好不要重新发明轮子。试试这个：

【讨论】：