如何在onmouseout时关闭组合框？

如何在onmouseout时关闭组合框？如何在onmouseout时关闭组合框？

<select onmouseout=""> 
<option value="volvo">Volvo</option> 
<option value="saab">Saab</option> 
<option value="mercedes">Mercedes</option> 
<option value="audi">Audi</option> 
</select>

来源

2010-06-28 FTI

你不能这样做（可靠地）。出现的弹出窗口不可用于以编程方式操作（即打开或关闭），并且其行为由浏览器（或操作系统）定义。

为了扩展这个进一步，IE和Firefox都可以通过模糊选择元素关闭弹出：

selectEl.blur();

虽然，在鼠标移开甚至事件触发，当你把鼠标移动到选项中弹出，所以它需要一点骇人听闻的魔力。在Chrome中，它会模糊选择元素，但该框将保持打开状态。

通常最好将UI组件的行为单独留下，以便用户通过与您的网站交互获得他们期望的体验。

来源

2010-06-28 13:59:29

嗯，我们可以点击鼠标的位置或任何地方当它onmouseout。我想如果我们能做到这一点，组合框会自动关闭。 – FTI 2010-06-28 14:05:54

你可以做一个小窍门，像这样...

<select onmouseover="size = 5" onmouseout="size = 0"> 
<option value="volvo">Volvo</option> 
<option value="saab">Saab</option> 
<option value="mercedes">Mercedes</option> 
<option value="audi">Audi</option> 
</select>

这将扩大鼠标在菜单上然后塌陷它，当你搬出。

编辑：这可能会导致与其他元素放置问题，如果你不小心。

来源

2010-06-28 14:06:18 Shaded

一两年后，但在别人正在看这个......我能够通过发送一个鼠标点击来切换Chrome中select元素的打开/关闭状态。在此示例中，将鼠标移到切换按钮上将切换<select>的状态。这是一个切换，而不是明确的开放或关闭，但为我工作。

<script type="text/javascript"> 

    function clickSelect(element) { 
     var event = document.createEvent('MouseEvents'); 
     event.initMouseEvent('mousedown', true, true); 
     element.dispatchEvent(event); 
    }; 

    function toggleSelect() { 
     clickSelect(document.getElementById("select")); 
    } 
</script> 


<form> 
    <select id="select"> 
     <option>one</option> 
     <option>two</option> 
    </select> 
    <input type="button" onmouseover="toggleSelect();" value="toggle select state" /> 
</form>

来源

2013-02-01 20:51:21

如何在onmouseout时关闭组合框？

回答

相关问题