我有一个类似菜单的下拉容器,通过绑定“mouseleave”事件来隐藏.
<div id="container">
<select>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>
</div>
我遇到的问题是我的容器的子元素包含一个SELECT对象,其中SELECT的OPTIONS物理地扩展到容器的边界之外.因此,将鼠标悬停在边界之外的OPTIONS上会触发“mouseleave”事件以触发并关闭我的下拉. SELECT是容器的子代,所以在这种情况下,我希望mouseleave事件能够识别它.
解决方法
Blocka解决方案的更新,因为它无法正确使用Firefox：
if ((typeof e.fromElement != 'undefined' && !e.fromElement.length) ||
(typeof e.fromElement == 'undefined' && e.target.tagName != 'SELECT')) {
// perform your mouseleave logic
}
