將鼠標懸停在選擇標籤中的選項

Question

請爲我的問題建議我一個解決方案。我有一個html 選擇標記。當我將鼠標懸停在選擇標記的任何選項上時，它必須在鼠標上方顯示圖像。我該怎麼做？？

Answer 1

你可以做一些事情像

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

根據W3C規範，不被選擇元素支持鼠標懸停事件。

除開發自定義下拉控件外，沒有解決方案您的要求。

Answer 3

OnMouseover事件的選項只適用於Firefox和不工作在IE瀏覽器。 對於IE，使用JQuery或使用onMouseover選擇標籤

Answer 4

您可以簡單地使用下面問題中的答案解決您的問題。有是解決鼠標事件問題一兩種方式與select option純JS

Mouse over option in select tag

一種方式 - 就是讓與選項中選擇元素<div>選擇與<buttons>或<li>列表形式內。您可以在我的CodePen項目頁面上看到它的工作原理： https://codepen.io/Sviatoslav_FrontEnd/pen/PQbBYQ