Javascript 如何使用JQuery在相似的块中显示/隐藏相同的块

代码如下：

<div class="mama">
    <div class="son">Item 1</div>
</div>
<div class="mama">
    <div class="son">Item 2</div>
</div>

$(".mama").hover(
    function() {
        $(".son").show();
    },
    function() {
        $(".son").hide();
    }
);

项目1
项目2
$（“.mama”）。悬停(
函数（）{
$（“.son”）.show（）；
},
函数（）{
$（“.son”）.hide（）；
}
);

---

期待帮助。谢谢

如果你想知道如何在每个“.mama”块中只隐藏“.son”块，那么应该是这样的：

$('.mama').each(function() {
  var mama = $(this);
  mama.hover(
    function() { mama.find('.son').show(); },
    function() { mama.find('.son').hide(); }
  );
});

---

如果您所做的只是显示或隐藏内容，则不需要jQuery。CSS已经有了这个功能

 .mama .son {
      display:none;
 }

 .mama:hover .son {
      display:block;
 }

使用事件并将您的操作范围限定到相关元素：

$("div.mama").hover(function() {
  $(this).find("div.son").show();
}, function() {
  $(this).find("div.son").hide();
});

---

关于如何将此限制为仅受影响元素的子元素，有许多不同的方法。

是否可以包含一些上下文/现有代码？没有它你的问题就没有意义真的。。。！IE6不支持：悬停在非锚点上。我只给出了一个使用JQuery解决其他复杂问题的简单示例。谢谢没有必要增加这种复杂性。看看我的答案。如果我们这样做：$（‘妈妈’）。。。只有第一个块有效。我们必须这样做：$（“div.mama”）。。。非常感谢。这是多么的积极和容易理解。非常感谢你！