jquery - 鼠标从 div 移动到 div，不要在父鼠标离开时隐藏未包裹在父内的 div - jquery

Question

以下情况正在发生：

两个div，

    <script type='text/javascript' src='jquery.min.js'></script>

  <div onmouseover="$(this).next('#mydiv').show();" onmouseleave="$(this).next('#mydiv').hide();" style="width:50px;height:50px;background:#000000;color:#ffffff;">hover</div>
  <div id="mydiv" onmouseleave="$(this).hide();" style="display:none;">content</div>

我的问题，

$(this).next('#mydiv').hide();

on mouseleave 导致无法专注于第二个 div，当第一个 div 发生 mouseleave 时，我需要隐藏第二个 div，仅当鼠标在离开第一个 div 后没有进入第二个 div 时才触发，例如进退两难。

我正在使用一个工具提示插件，并且无法将第二个 div 包装在第一个 div 中，这将是一个解决方案，但对我来说是一个更大的问题。

Answer 1

我没有更改您实现 jquery 的方式，但您应该更改为外部文件

见http://jsfiddle.net/bp6Gv/

<div onmouseover="$(this).next('#mydiv').addClass('active');" onmouseleave="$(this).next('#mydiv').removeClass('active');" style="width:50px;height:50px;background:#000000;color:#ffffff;">hover</div>
  <div id="mydiv" onmouseover="$(this).addClass('active')" onmouseleave="$(this).removeClass('active');" >content</div>

CSS

#mydiv {
   display: none;
}
#mydiv.active {
   display: block;
}