如何在HTML“选项”上显示工具提示?标签? [英] How can I display a tooltip on an HTML "option" tag?

查看:120
本文介绍了如何在HTML“选项”上显示工具提示?标签?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

无论是使用纯HTML还是jQuery辅助JavaScript,如何在单个< option> 元素上显示工具提示以帮助决策过程(没有足够的需要一个不同类型的控制空间,并需要一些帮助)。



这可以通过插件或类似的方式完成吗?



我已经尝试了jQuery的一些工具提示插件,但没有成功(包括名为Tooltip的工具提示)。

此解决方案应该:


  • 可在IE,WebKit以及Gecko中使用; 使用标准< select> 包装< option> 元素


  • 因此,如果解决方案想要使用其他标签,它应该将这些元素动态地转换为它所需的元素(并且不要期望最初的标记不一样)。




    这个代码可以在这里找到,它在安全之下冲浪部分,我想在这里展示一些关于选项意义的选项的滚动帮助。目前它只能在事后显示,对用户的一些前期帮助是有益的。

    欣赏这并不容易,将可能需要创建 - 所以奖金将授予最完整的解决方案或特定的钩子,使我最接近我可以创建的解决方案。

    解决方案

    从这个问题出现以来,似乎在其他浏览器已经追上(至少在Windows上......不知道其他浏览器)。您可以在选项标记上设置标题属性:

    < option value =title =工具提示>某些选项< ; /选项>



    这在Chrome 20,IE 9(及其8和7模式),Firefox 3.6,RockMelt 16基于铬)全部在Windows 7上运行


    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?

    I have tried a few tooltip plugins for jQuery with no success (including the one called Tooltip).

    This solution should:

    • 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).


    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.

    Appreciate that this is not easy and that something will probably need to be created - so the bounty will be awarded to the most complete solution or the specific hook that lands me closest to a solution I can create.

    解决方案

    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">Some option</option>

    This worked in Chrome 20, IE 9 (and its 8 & 7 modes), Firefox 3.6, RockMelt 16 (Chromium based) all on Windows 7

    这篇关于如何在HTML“选项”上显示工具提示?标签?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆