按钮上的 jQuery UI 1.9 工具提示在悬停时不起作用

【问题标题】：jQuery UI 1.9 tooltip on button not working on hover按钮上的 jQuery UI 1.9 工具提示在悬停时不起作用
【发布时间】：2012-12-13 03:21:02
【问题描述】：

我正在使用 jQuery UI 1.9 来制作复选框按钮和工具提示。我的 HTML 很简单：

<input type="checkbox" id="jq-ui-button" value="Test" title="tooltipppp">
<label for="jq-ui-button">Label ok</label>

然后我调用JS：

$("input[type='checkbox']").button();
$("input[type='checkbox']").tooltip();

问题是我在单击按钮/复选框时看到了工具提示，但我想在悬停时正常看到工具提示。这是 jQuery UI 1.9 中的错误还是我怎样才能达到我想要的效果？

【问题讨论】：

【解决方案1】：

我的理解是，当.button() 应用于复选框时，关联的标签被设置为按钮。因此，可能需要将.tooltip() 应用于标签而不是复选框本身：

$("input[type='checkbox']").button();
$("label[for='jq-ui-button']").tooltip();

因此也需要将关联的title 属性应用于标签：

<input type="checkbox" id="jq-ui-button" value="Test">
<label for="jq-ui-button" title="tooltipppp">Label ok</label>

【讨论】：

是的，这会起作用。 title 属性也应该重新定位到 <label> 元素。更新了小提琴here。另请注意，您可以通过调用一次$(document).tooltip() 而不是为多个选择器调用$("selector").tooltip() 来全局应用工具提示。