如何手动关闭在 table 上设置的 jquery-ui 工具提示,但使用项目选择器在 td 上创建的工具提示

How do I manually close jquery-ui tooltip set on table but tooltip created on td using items selector

我正在尝试手动关闭工具提示。工具提示是在 table 上使用 select 某些 td 的项目选项创建的。单击 td 时,它应该关闭工具提示。这似乎不起作用。

<table id="thingtable">
  <tr><td class="thing one">One</td></tr>
  <tr><td class="thing">Two</td></tr>
</table>

$("#thingtable").tooltip({
  items: ".thing",
  content: "Thing"
});

$(".one").click(function (e) {
  $("#thingtable").tooltip("close");
});

如果我直接将工具提示添加到 td,那么它就可以工作了。

$(".thing").each(function (index) {
  $(this).tooltip({
    items: ".thing",
     content: "Thing"
  });
});

$(".one").click(function (e) {
  var td = $(e.target);
  td.tooltip("close");
});

Here is a fiddle. 单击 fiddle 中的“一”不会关闭工具提示,但单击“三”会。

必须向每个 td 添加工具提示似乎是错误的,尤其是当 table 方法除了这个手动关闭问题之外还有效时。那是我必须走的路吗?

点击事件中,需要用到closedisable方法。警告是您是否希望启用它们以供以后使用。这是一种方法。

工作示例:https://jsfiddle.net/Twisty/hn4tqzrL/2/

JavaScript

  $(".one").click(function() {
    console.log("Thing One clicked.");
    $("#thingtable").tooltip("close").tooltip("disable");
  }).hover(function() {
    $("#thingtable").tooltip("enable");
  }, function() {
    $("#thingtable").tooltip("enable");
  });

利用.hover()我们可以检测鼠标何时移入和移出并触发enable方法。从技术上讲,我们不需要对 handlerIn 函数采取任何操作。