jquery - 使用jQuery显示/隐藏上一个元素

好的，从理论上讲，这应该很简单，但是我已经尝试了诸如parent，parentsUntil，next之类的多种方法，但是还没有弄清楚。我有几个div，如下所示，每个都有一个隐藏的图像和一个可见的图像，以及两个可见的按钮。当您将鼠标悬停在按钮上时，它应该显示或隐藏显示/隐藏的图像。<div class="quarterWidth boxShadow"> <h2>category</h2> <img src="image.jpg" width="180" height="180" alt="xyz" class="normalPic"> <img src="other.jpg" width="180" height="180" alt="xyz" class="hoverPic"> <p class="button button180"><a class="trad" href="#">Traditional</a></p> <p class="button button180"><a class="contemp" href="#">Contemporary</a></p></div>我已经成功地用jQuery隐藏了.hoverPic，并且当我将鼠标悬停在a.contemp按钮上时，我希望隐藏.normalPic图像并显示.hoverPic，而当您将鼠标悬停在。您到底将如何使用jQuery实现此目标？这是我可怜的尝试：$(function() { $('.hoverPic').hide(); $('.contemp').hover(function(){ $(this).parentsUntil('.boxShadow').next('.normalPic').hide(); $(this).parentsUntil('.boxShadow').next('.hoverPic').show(); }); $('.trad').hover(function(){ $(this).parentsUntil('.boxShadow').next('.normalPic').show(); $(this).parentsUntil('.boxShadow').next('.hoverPic').hide(); });}); (adsbygoogle = window.adsbygoogle || []).push({}); 最佳答案 我个人将使用.closest()查找父级div，然后将其用作上下文以查找相关图像：$(function() { $('.hoverPic').hide(); $('.contemp').hover(function(){ var $parent = $(this).closest("DIV"); $('.normalPic', $parent).hide(); $('.hoverPic', $parent).show(); }); $('.trad').hover(function(){ var $parent = $(this).closest("DIV"); $('.normalPic', $parent).show(); $('.hoverPic', $parent).hide(); });}); (adsbygoogle = window.adsbygoogle || []).push({});