在尝试了各种可能性之后,我发现你可以检查鼠标是否在
select
document.elementsFromPoint
.
if (document.elementsFromPoint(event.clientX,event.clientY).includes(list)) return;
var list=document.querySelector('div#list>select');
list.addEventListener('mouseleave',exit,true);
function exit(event) {
// Check the mouse is inside select element
if (document.elementsFromPoint(event.clientX,event.clientY).includes(list)) return;
event.stopPropagation();
if(event.target!==this) return;
console.log(`${this} ${event.eventPhase} ${event.target}\n`);
}
<div id="list">
<select name="list" size="9">
<option>Eight</option>
<option>Five</option>
<option>Four</option>
<option>Nine</option>
<option>One</option>
<option>Seven</option>
<option>Six</option>
<option>Three</option>
<option>Two</option>
</select>
</div>
