Hovering over option in a select list (window ) in IEs does not generate a tooltip

Question

Hovering over option in a select list (window ) in IEs does not generate a tooltip, but works fine in FireFox and Chrome. I've set up a working demonstration on jsbin.com and jsfiddle.net, whichever is more convenient.

• Link To jsfiddle.net Demo.
• Link To jsbin.com Demo.
• So you can see it in action.

The function which is in use was not written by me, I found it here: owainlewis.com/blog/post/simple_jquery_tool_tip_plugin. Originally it was written for showing 'tittle' attributes as a tool-tip, but I re-wrote it some of it (replaced 'title' with 'option') to accommodate my needs. To know exactly what I mean, check out those demos in Firefox or Chrome first.

Sorry, I forgot to mention that this HTML code is generated by PHP. Using title attribute would be great for me, if I was in charge of PHP, then I would not have to re-write the original plugin. Unfortunately, for now I have to keep looking.

PS

I am open to any workarounds. (If there is no hack I will go back to the title attribute.)

Answer 1

You don't need JavaScript to do it, and in fact, you can't use JavaScript to do it. IE does not respond to mouseover on option items. If you need dynamic tooltips just change the title attribute of the option.

Though it's a simple title attribute, this works for me in IE9: http://jsfiddle.net/n5YUk/4/

Check the first option in the list - I changed it to:

<option title="dash dash" Value="">--</option>

I know it's not what you're hoping to get but it's the only way you'll get it in IE.

Paul

Answer 2

设置option的title属性（也可以通过设置attr来使用jquery）标签，您应该会做得很好。