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
                            }

                    });

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

1 个答案: