使用onmouseleave.

或者，在 jQuery 中，使用 mouseleave()

这正是您正在寻找的东西。例子：

<div class="outer" onmouseleave="yourFunction()">
    <div class="inner">
    </div>
</div>

或者，在 jQuery 中：

$(".outer").mouseleave(function(){
    //your code here
});

一个例子是here。

对于在大多数情况下有效的更简单的纯 CSS 解决方案，可以pointer-events通过将其设置为none

.parent * {
     pointer-events: none;
}

浏览器支持：IE11+

function onMouseOut(event) {
        //this is the original element the event handler was assigned to
        var e = event.toElement || event.relatedTarget;
        if (e.parentNode == this || e == this) {
           return;
        }
    alert('MouseOut');
    // handle mouse event here!
}



document.getElementById('parent').addEventListener('mouseout',onMouseOut,true);

我做了一个快速的 JsFiddle 演示，包含所有需要的 CSS 和 HTML，检查出来......

编辑跨浏览器支持的固定链接http://jsfiddle.net/RH3tA/9/

请注意，这仅检查直接父级，如果父级 div 具有嵌套的子级，那么您必须以某种方式遍历父级元素以查找“原始元素”

嵌套子项的编辑示例

编辑修复了希望跨浏览器

function makeMouseOutFn(elem){
    var list = traverseChildren(elem);
    return function onMouseOut(event) {
        var e = event.toElement || event.relatedTarget;
        if (!!~list.indexOf(e)) {
            return;
        }
        alert('MouseOut');
        // handle mouse event here!
    };
}

//using closure to cache all child elements
var parent = document.getElementById("parent");
parent.addEventListener('mouseout',makeMouseOutFn(parent),true);

//quick and dirty DFS children traversal, 
function traverseChildren(elem){
    var children = [];
    var q = [];
    q.push(elem);
    while (q.length > 0) {
      var elem = q.pop();
      children.push(elem);
      pushAll(elem.children);
    }
    function pushAll(elemArray){
      for(var i=0; i < elemArray.length; i++) {
        q.push(elemArray[i]);
      }
    }
    return children;
}

和一个新的JSFiddle，编辑更新的链接

这是基于以下内容的更优雅的解决方案。它解释了从不止一个级别的孩子冒出来的事件。它还解释了跨浏览器的问题。

function onMouseOut(this, event) {
//this is the original element the event handler was assigned to
   var e = event.toElement || event.relatedTarget;

//check for all children levels (checking from bottom up)
while(e && e.parentNode && e.parentNode != window) {
    if (e.parentNode == this||  e == this) {
        if(e.preventDefault) e.preventDefault();
        return false;
    }
    e = e.parentNode;
}

//Do something u need here
}

document.getElementById('parent').addEventListener('mouseout',onMouseOut,true);

而不是 onmouseout 使用 onmouseleave。

您尚未向我们展示您的具体代码，因此我无法在您的具体示例中向您展示如何操作。

但它非常简单：只需将 onmouseout 替换为 onmouseleave。

这就是全部:) 所以，很简单:)

如果不确定如何操作，请参阅以下说明：

https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_onmousemove_leave_out

蛋糕的和平:) 享受它:)