如何在 HTML“选项"上显示工具提示?标签?
无论是使用纯 HTML 还是 jQuery 辅助 JavaScript,如何在单个 <option>
元素上显示工具提示以帮助决策过程(没有足够的空间容纳不同类型的控制和一些帮助将需要).
Either using plain HTML or jQuery assisted JavaScript, how do you display tooltips on individual <option>
elements to aid the decision process (there is not enough room for a different kind of control and some help will be needed).
这可以通过插件或类似的方式完成吗?
Can this be done though a plug-in or similar?
我尝试了几个用于 jQuery 的工具提示插件,但都没有成功(包括一个叫做 Tooltip 的插件).
I have tried a few tooltip plugins for jQuery with no success (including the one called Tooltip).
这个解决方案应该:
- 在 IE、WebKit 和 Gecko 中工作;
- 利用标准
<select>
包装的<option>
元素.
- work in IE, WebKit as well as Gecko;
- utilizing standard
<select>
wrapped<option>
elements.
因此,如果解决方案想要使用其他标签,它应该将这些元素动态转换为所需的内容(并且不要期望初始标记有任何不同).
So if the solution wants to use other tags it should convert those elements into what it needs dynamically (and not expect the initial mark-up to be any different).
可以在 here 找到此代码,它位于 SafeSurf 部分下,我想在其中显示关于选项含义的选项翻转的一些帮助.目前只能事后"显示.并且为用户提供一些前期帮助将是有益的.
The code for this can be found here, it is under the SafeSurf section, where I want to display some help on rollover of the options as to the meaning of the choices. At present it can only be displayed "after the fact" and some upfront help for the user would be beneficial.
意识到这并不容易,并且可能需要创建一些东西 - 因此赏金将授予最完整的解决方案或使我最接近我可以创建的解决方案的特定钩子.强>
推荐答案
似乎在被问到这个问题后的 2 年里,其他浏览器已经赶上了(至少在 Windows 上……不确定其他浏览器).您可以在选项标签上设置标题"属性:
It seems in the 2 years since this was asked, the other browsers have caught up (at least on Windows... not sure about others). You can set a "title" attribute on the option tag:
<option value="" title="Tooltip">一些选项</option>
这适用于 Windows 7 上的 Chrome 20、IE 9(及其 8 和 7 模式)、Firefox 3.6、RockMelt 16(基于 Chromium)
This worked in Chrome 20, IE 9 (and its 8 & 7 modes), Firefox 3.6, RockMelt 16 (Chromium based) all on Windows 7
相关文章