javascript - jQuery：仅当用户将鼠标移出容器时才触发“mouseout”？

Question

我有一个带有两个内部 div 的父 div，它们是 Google Maps OverlayView 的一部分：

<div id="container">
    <div id="inner1">inner 1</div>
    <div id="inner2">inner2</div>
</div>

我只想mouseout在用户将鼠标移到#container. 目前我有这个代码：

    google.maps.event.addDomListener(this.$content.get(0), "mouseout", function (e) {
      console.log('InfoWindow mouseleave', $(e.fromElement));
    }); 

但只要用户将鼠标移入，它就会触发#inner1。事实上，看起来e.fromElement，每当用户将鼠标移入容器时，它似乎都会触发！我能做些什么？

jQuery 中的正确答案似乎是使用 mouseleave 事件，但我似乎无法在 Google 地图中访问该事件 - 至少，如果我将 mouseout 更改为 mouseleave，则该事件将不再触发。

这个 jsFiddle 演示了基本问题：http: //jsfiddle.net/pvB4u/1/

Answer 1

如果它不起作用，您可以尝试替代方法。获取鼠标指针的 pageX 和 pageY（需要在 document.ready() 中对其进行初始化。然后检查它是否在最外层容器的边界内。
像这样的东西

$(document).mousemove(function (e) {                        

                            if ($("#container").offset().left > e.pageX || (parseInt($("#container").offset().left) + $("#container").width()) < e.pageX
                        || $("#container").offset().top > e.pageY || (parseInt($("#container").offset().top) + $("#container).height()) < e.pageY) {
                                // This will be your required mouseout event
                            }

                    });