如何让鼠标移到select中option上时产生事件
发布网友
发布时间：2022-12-06 20:43
共1个回答
热心网友
时间：2024-12-02 14:05
<select size=3 >
<option id="1">1</option>
<option id="2">2</option>
<option id="3">3</option>
<option id="4">4</option>
<option id="5">5</option>
<option id="6">6</option>
</select>
当我鼠标移上select中的一个option时能不能获取当前option的值呢？那个onchange我知道，我想用onmouseove事件是不是可以做到？
如果不行，有哪个大大能告诉我怎么重写个select啊，从而能达到上述效果呢？
我想了很长时间都没想出来，希望有哪个大大解决下，那个希望在html上做。
问题补充：<div>qinglangee 写道</div><div><pre name="code">
<html>
<head>
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript">
function attachTest() {
$("#select").bind("mouseover", function(e){
if (e.target.id!= 'select') {
document.getElementById('test').innerHTML = e.target.value;
}
});
}
</script>
</head>
<body onload="attachTest()">
<div id="test">Something Here</div>
<select id="select" size=2>
<option value="1" id="ooo">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
<option value="4">Four</option>
</select>
</body>
</html>
</pre></div> <br /><div>qinglangee 写道</div><div>以下代码只在firefox chrome等浏览器中有效 <br />因为ie6中<option>没有onmouseover事件,所以用jquery绑定事件也是一样 <br /> <br />所以还是用div来模仿select显示比较好 <br /><pre name="code">
<html>
<head>
<script type="text/javascript">
function showselectValue(e) {
if (e.target.id!= 'select') {
document.getElementById('test').innerHTML = e.target.value;
}
}
function attachTest() {
document.getElementById('select').addEventListener('mouseover',showselectValue,false);
}
</script>
</head>
<body onload="attachTest()">
<div id="test">Something Here</div>
<select id="select" size=3>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
<option value="4">Four</option>
</select>
</body>
</html>
</pre> <br /></div> <br />
