javascript 选择标签中的鼠标悬停选项
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/8342048/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Mouse over option in select tag
提问by RAVITEJA SATYAVADA
Please suggest me a solution for my problem. I have a html selecttag. When i mouse over on any option of select tag, it has to show an image on mouse over. How can i do it??
请为我的问题建议一个解决方案。我有一个 html选择标签。当我将鼠标悬停在选择标签的任何选项上时,它必须在鼠标悬停时显示图像。我该怎么做??
回答by Strelok
According to the w3c spec, mouseover event is not supported by the option element.
根据 w3c 规范,选项元素不支持鼠标悬停事件。
There is no solution your requirement except to develop a custom drop down control.
除了开发自定义下拉控件之外,没有您需要的解决方案。
回答by Esha Wali
OnMouseover event for option works only in firefox and doesnt work in IE. For IE, either use JQuery or use onMouseover for select tag
选项的 OnMouseover 事件仅在 Firefox 中有效,在 IE 中无效。对于 IE,使用 JQuery 或使用 onMouseover 作为选择标签
回答by Sviat Kuzhelev
You can simply solve your problem using the answer in the question below. There are a two waysof solving mouse events problem with select option
on pure JS
您可以使用以下问题中的答案简单地解决您的问题。有是两种方法与解决鼠标事件问题select option
上的纯JS
Mouse over option in select tag
One of the way - is to make the select element with options in the form of <div>
selector with <buttons>
or <li>
list inside. The introdusing of how it work you can see on my CodePen project-page below:
https://codepen.io/Sviatoslav_FrontEnd/pen/PQbBYQ
一种方法 - 是使 select 元素以选择<div>
器 with<buttons>
或<li>
list的形式带有选项。您可以在下面的我的 CodePen 项目页面上看到它如何工作的介绍:https://codepen.io/Sviatoslav_FrontEnd/pen/PQbBYQ
回答by Sai Kalyan Kumar Akshinthala
You can do some thing like
你可以做一些像
<select title="This is a select">
<option value="blah blah" onmouseover="window.status=this.value" title="blah blah">item 1</option>
<option value="hello" onmouseover="window.status=this.value" title="hello">item 2</option>
<option value="hi" onmouseover="window.status=this.value" title="hi">item 3</option>
</select>
refer to the mouseoverfor more
有关更多信息,请参阅鼠标悬停