Javascript 如果鼠标通过另一个面板离开，弹出窗口需要保持打开状态

我正试图在我的一个组件上创建一个鼠标悬停在弹出窗口上。它基本上是一个过滤器弹出窗口，当用户将鼠标悬停在表项上时弹出

以下是显示鼠标移动的示意图：

鼠标进入A区，B区弹出

老鼠离开A区，B区消失

鼠标离开分区A进入分区B，但分区B仍然保持打开状态

老鼠离开B区，B区消失

我在步骤（1）中使用jQuery鼠标盖，效果很好。我正在为步骤（2）使用jquerymouseleave，这也很好用

我的问题是步骤（3）。我试图听到鼠标离开DIV A，但如果它通过DIV B离开DIV A，则不要移除DIV B。我想说，如果鼠标离开了，但鼠标在B区上方，那么不要隐藏它。某种鼠标悬停事件？情感倾听者

这是我目前掌握的代码：

$(this.filterFlag).mouseover(function(){
    self.view.appendChild(self.pop.getView());
});
$(this.filterFlag).mouseleave(function(){
    self.view.removeChild(self.pop.getView());

    //but if mouse leaves into the popup, don't hide pop up.
});

---

有什么办法吗？

为

B

添加

mouseenter

，

mouseleave

事件，当这些事件发生时触发

A

的相应事件。这是非常低效的，但有效

还要记住，如果

self.pop.getView（）

为每个调用返回相同的元素，则必须取消绑定并重新绑定事件

$(this.filterFlag).mouseover(function(){
    var that = this;
    var c = self.pop.getView();
    self.view.appendChild(c);
    $(c).mouseenter(function() {
      $(that).mouseenter();
    })
    .mouseleave(function() {
      $(that).mouseleave();
    });
});
$(this.filterFlag).mouseleave(function(){
    self.view.removeChild(self.pop.getView());

    //but if mouse leaves into the popup, don't hide pop up.
});

这是一个示例

---

CSS解决方案将更加有效

HTML:

---

将分区A和B放在全局分区中。如果不指定任何大小，它将适合其内容。只需将鼠标夹绑在容器上，使B区分离，将鼠标夹绑在A区，使B区分离。如果隐藏了Div B，则Div A=Div content。如果div B是可见的，那么div content=divA+div B。这就是你要找的。不行。在图中，DIVA和DIVB完全对齐，但实际上DIVB向右侧溢出（即更宽），因此它们不能同时放入DIV exactlySo，请给它们一个不与样式绑定的类名，但仅用于选择。类似于

的东西请查看：。虽然都在CSS3中，但它可能会在一些方面帮助您stuff@686哈哈，太棒了。但我想我会和泰米尔人一起去answer@OliverWatkins：欢迎！：-）
<div class='parent'>
  <div id='A'></div>
  <div id='B'></div>
</div>

#B { display: none;}
.parent:HOVER #B { display: block;}