javascript - 当鼠标通过选项/使用 onmouseover 选择选项时选择标记事件

Question

到目前为止，我已经创建了一个简单的选择标签(有效)，它会在选项更改时更改图像(这意味着我必须单击才能进行更改，从而更改图片):

<form  method="post" action="">
<select name="selectImageName3" id="selectImage3"  onchange="change3()" >                  
     <option value="opt1">Image1</option>
     <option value="opt2">Image2</option>
     <option value="opt3">Image3</option>
</select>
</form>

但是我希望当鼠标通过选项并根据选项时我的图像会发生变化。这意味着当鼠标传递一个选项(不点击)时:- 必须记录关联的选项值(用于我的 js 函数 change3)- 必须激活函数 change3()。

我假设这通常是使用 onmouseover 完成的，但据我所知，它不适用于 select 标签。

有人知道/有办法处理这个吗？比如select2会解决问题吗？我并不特别关注 html、javascript、css 或 jquery，只要我能处理我的问题就可以了。

谢谢

Answer 1

您可以使用 jQuery 来执行此操作。您将鼠标悬停功能添加到选择标签，例如

$(document).ready( 

     function (event) {
        $('select').mouseover(function(e) {
        var target = $(e.target);
       //do something with the target
     });

});

其中 $(target).val() 给出您悬停的选项的值。