如何在 jquery ui 中为选择菜单提供工具提示？答案

【问题标题】：How to give a selectmenu a tooltip in jquery ui?如何在 jquery ui 中为选择菜单提供工具提示？
【发布时间】：2014-09-10 17:46:55
【问题描述】：

我正在用新的jquery-ui selectmenu widget 替换select（嗯：“覆盖”会更准确）。

在选择时，我可以轻松添加工具提示。我正在使用jquery-ui tooltip plugin。

我试过了，但没有给selectmenu一个：

* 选择上的工具提示不再起作用 * 将工具提示设置为选择菜单元素的顶部跨度 ('.ui-selectmenu-button') 也不起作用

可以吗？

我正在使用jquery ui 1.11.0

【问题讨论】：

标签： jquery jquery-ui tooltip jquery-ui-tooltip jquery-ui-selectmenu

【解决方案1】：

DEMO 的 jquery-ui 选择菜单上的 jquery ui 工具提示。

JS代码：

$(function() {
     var select_id = "SelectMenu";
     $( "#"+select_id ).selectmenu();

     $( "#"+select_id+"-button").tooltip({items: "span", content: 'This is select'});
});

HTML：

<label for="SelectMenu">Selectmenu example:</label>
    <select name="SelectMenu" id="SelectMenu">
        <option id="option1" title="Tooltip1">option1</option>
        <option id="option2" title="Tooltip2">option2</option>
    </select>

【讨论】：

非常感谢！不过有两件事我不明白： 1. 你有'$("#"+select_id+"-button")' 的魔法吗？ 2. 'items: "span"' 部分是做什么的？没有这个，它似乎不起作用
o.k., '$( "#"+select_id+"-button")' 当我检查由 jquery-ui 创建的 html 时出现
您是否注意到，如果您快速转到列表中的其他项目，选择菜单项（这是一个选择）的工具提示会比它应有的时间更长（至少在 Windows 上的 Chrome 中）？似乎它没有得到失去焦点的消息，并且工具提示一直显示