jQuery：多个“醉酒”工具提示

Question

当我从数据库中带回结果列表时，它们显示如下：

结果1
结果2
结果3

等等...现在我已经让 jQuery Tipsy 插件开始工作，因此当您将鼠标悬停在结果 1 的顶部时，它会显示该人员的用户名。问题是，如果我将鼠标悬停在结果 2 上，也应该出现 Tipsy 工具提示，但它只是显示正常的浏览器工具提示。

我假设这是因为结果 a 标记上的所有 id 的名称都相同：“east”。我想我需要对 jQuery 中的每个检查进行某种操作，但我不太清楚在 jQuery 中将其添加到哪里。

有人有解决这个问题的方法吗？

Answer 1

您的问题是所有 3 个 a 标签上的 ID 相同。在任何情况下都不允许将相同的 ID 应用于同一页面上的多个元素。你需要解决这个问题。

<a href="result_one.html" id="result_one" class="tipsy">Result 1</a>
<a href="result_two.html" id="result_two" class="tipsy">Result 2</a>
<a href="result_three.html" id="result_three" class="tipsy">Result 3</a>

您可以将同一个类应用于所有三个 a 标记，然后将 Tipsy 应用于该类。

$(document).ready(function() {
  $('.tipsy').tipsy({fade:true,gravity:'n'});
});

或者你可以单独做每个ID。

$(document).ready(function() {
  $('#result_one').tipsy({fade:true,gravity:'n'});
  $('#result_two').tipsy({fade:true,gravity:'n'});
  $('#result_three').tipsy({fade:true,gravity:'n'});
});