javascript - Jquery 查找下一个(指定的)元素不工作

Question

我正在尝试使用 Jquery 查找下一个 div。这是代码:

$('.menu-item').hover(function() {
  $(this).stop(true, true).addClass("menu-item-hover", 300);
  $(this).next('div').stop(true, true).fadeIn(300);
}, function() {
  $(this).stop(true, true).removeClass("menu-item-hover", 300);
  $(this).next('div').stop(true, true).fadeOut(300);
});


<a href="media.html"><div class="menu-item"><h1>Media</h1></div></a>
<div id="tooltip-media">Sights and sounds from Cambodia</div>

<a href="about.html"><div class="menu-item"><h1>About</h1></div></a>
<div id="tooltip-about">Who in the world is the Phillips Family?</div>

简单。 toolip-* div 隐藏在 css 中。我希望代码中的下一个在 menu-item 悬停时显示。我检查了其他问题，但没有一个适合我的情况。我同时使用 Jquery 和 Jquery UI。感谢您的帮助。

Answer 1

试试这个

$(this).parent().next('div').stop(true, true).fadeIn(300);

在您的示例中，您试图找到下一个 div 但它不是菜单项的同级。只有它没有用。遍历父级并找到下一个 div 它将起作用。

parent() , next()