jQueryUI 工具提示：IE 选择框的问题答案

【问题标题】：jQueryUI Tooltip: Issues with IE select boxesjQueryUI 工具提示：IE 选择框的问题
【发布时间】：2016-09-29 13:26:49
【问题描述】：

对于我的一生，我无法弄清楚这一点。 jQueryUI 工具提示功能（相对较新）完美适用于所有浏览器中的所有内容。除了 IE 中的选择框！由于某些原因，IE 似乎将每个“选项”元素作为“选择”的一个非常相关的部分来读取。因此，即使在 IE 中，当您仅将鼠标悬停在选择框上时，工具提示也能完美运行，但一旦您单击它，它就会中断。

我正在使用 jQuery 版本 1.5 beta1（尽管我在 1.4 以后的每个版本中都对此进行了测试）和 jQueryUI 版本 1.8.8。

编辑：这方面的一个例子可以在this location 看到。

【问题讨论】：

标签： jquery internet-explorer jquery-ui jquery-tooltip

【解决方案1】：

这里是错误的链接： http://bugs.jqueryui.com/ticket/8798

他们建议的解决方案是将文本包装在另一个元素中，例如 div，这将触发工具提示。

<div class="tooltip" title="Some text">
    <select>
       <option>...</option>
    </select>
</div>

【讨论】：

有一个扩展用 span 包装了“select”元素：ozzu.com/programming-forum/…参见“jquery.tooltipFix.js”。

【解决方案2】：

您始终可以检测用户代理标头并显示“抱歉，此站点需要使用浏览器”。当有人带着 IE 进来的时候。 :)

【讨论】：

哈！是的，我已经在一些个人网站中这样做了（将它们重定向到下载 Chrome 等），但不幸的是，这是针对客户端的生产环境。顺便说一句，我从来没有解决过这个问题，我只是求助于制作自己的工具提示，并希望 jQueryUI 将来能改进他们的。

【解决方案3】：

将此代码用于tooltip 在ie 浏览器上工作

$( "select" ).each(function(){$(this).wrap( "<span title='"+ $(this).attr("title")+"'></span>" );$(this).removeAttr("title");});

【讨论】：

更好的是，使用“select[title]”，这样你就只包装有标题的选择。