本质上,问题是悬停(或悬停 div)中包含的选择框不允许您实际选择选项 - 当您从选择框移动到选项时,悬停会失去焦点并关闭。仅在 IE8 及更低版本中发生,因为据我了解,这些选项不被视为 IE8 或更早版本中选择框的实际部分。
在这里以最基本的形式展示:
仅在 IE8 及更早版本中发生。
我认为理想的解决方案将是一个更通用的脚本,它可以重置 IE8 或更早版本中的选择和选项,使其像在其他所有内容中一样。Chrome、FF、IE9+等都没有问题。
谢谢!
的HTML
<div id="button_box"><h2>Hover This</h2>
<div id="form_box">
<form action="#" method="post">
<select id="select_option" onChange="Javascript:doSomething();">
<option value="a">Value A</option>
<option value="a">Value B</option>
<option value="a">Value C</option>
<option value="a">Value D</option>
<option value="a">Value E</option>
</select>
</form>
</div>
</div>
CSS
#button_box { display:block; width: 150px; height: 75px; position:relative; background: #ddd; }
#button_box h2 { text-align: center }
#button_box #form_box { display: none; position:relative; width: 150px; background: #ccc }
#button_box:hover #form_box { display:block }
#form_box select { background: #bbb }