Question

我正在使用IE7。当鼠标悬停在选项上时，我想在页面中显示选择框中每个选项的描述。因此，当我开始编写代码时，当鼠标悬停在选项上时，该代码会在文本框中显示选项值。但它永远不会奏效。它就像一个改变事件。

<input name="selectedValue" id="selectedValue" >
<select id="TestCombo" name="TestCombo" >
     <option value="0" selected="selected">Zero</option>    
 <option value="1">One</option>
 <option value="2">Two</option>
 <option value="3">Three</option>
</select>

<script type="text/javascript">
$( function() {
    $('#TestCombo option').mouseover( function() {
          $('#selectedValue').val($('#TestCombo option:selected').val());
    });
});
</script>

提前致谢

Answer 1

如果您希望说明显示在鼠标悬停上，而不是更改，我认为最好使用工具提示。这可以使用HTML的title属性完成，不需要JS。

示例：

<input name="selectedValue" id="selectedValue"> <select id="TestCombo" name="TestCombo" > <option title="Nothing." value="0" selected="selected">Zero</option> <option title="The smallest number that has a meaning." value="1">One</option> <option title="Look, another small number!" value="2">Two</option> <option title="RGB - Red-Green-Blue. That's three colors!" value="3">Three</option> </select>

Answer 2

您要做的不是标准的网络练习。我不是说错了，我明白你为什么要做这样的事情。我认为您的答案是不要理会选择控件，并尝试查找或设计一个与输入元素一起使用的控件，并模仿'select'正在做什么。它不会那么困难，最终你可能会有更好的控制和跨浏览器功能。

Answer 3

我会使用某种类型的插件（例如this one），它与浏览器兼容并操纵ul看起来像select下拉列表。

不幸的是，IE在select元素上放弃了球，并且几乎没有控制它们。

用于IE的鼠标悬停选项

3 个答案: