Question

请建议我解决我的问题。我有一个html 选择标记。当我鼠标悬停在选择标签的任何选项上时，它必须在鼠标悬停上显示图像。我该怎么办？

Answer 1

根据w3c规范，option元素不支持mouseover事件。

除了开发自定义下拉控件之外，您的要求没有解决方案。

Answer 2

你可以做一些像

这样的事情

<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>

请参阅mouseover了解更多

Answer 3

选项的OnMouseover事件仅适用于Firefox，并且在IE中不起作用。对于IE，要么使用JQuery，要么使用onMouseover来选择标记

Answer 4

您可以使用下面问题中的答案简单地解决您的问题。 是纯粹JS上用select option解决鼠标事件问题的两种方式

Mouse over option in select tag

其中一种方法是将select元素设置为<div>选择器形式的选项，其中包含<buttons>或<li>列表。您可以在我的CodePen项目页面上看到它的工作方式： https://codepen.io/Sviatoslav_FrontEnd/pen/PQbBYQ

将鼠标悬停在选择标记中

4 个答案: