javascript - 是否可以触发事件然后将事件扩展到另一个元素？

Question

假设我有一个结构不良的下拉菜单，类似于:

<div class="regular"><a href="#">title</a></div>
<div class="menu">
    <a href="#">title</a>
    <div class="menu_wrapper">
        <a href="#">sub title</a>
        <a href="#">sub title</a>
    </div>
</div>

在这种情况下，它是用 .menu_wrapper 构建的，具有 position:absolute; 的属性，导致顶级 .menu 悬停时，.menu_wrapper 不被视为同一元素的一部分，因此当尝试将其悬停在其上时会导致中断，因为它不再是同一悬停事件的一部分。

我想知道是否有可能在 .menu 上有一个事件绑定(bind)器，但是一旦事件被触发，将绑定(bind)器显式扩展到 .menu_wrapper 以便“悬停效果”稳定且有效。

与尝试重新排列我拥有的大量结构不良的 CSS 相比，这似乎是一个更简单的解决方案。

如有任何想法、意见和帮助，我们将不胜感激 ;)。

Answer 1

你试过这样的事情吗？ (jQuery)

$(".menu").hover(
  function () {
    $(".menu_wrapper").show();
  },
  function () {
    $(".menu_wrapper").hide();
  }
);