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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 03:07:42  来源:igfitidea点击:

Mouse over option in select tag

javascripthtml

提问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 optionon 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

有关更多信息,请参阅鼠标悬停