Javascript 当我悬停在另一个div上时，jQuery只显示一个div

我有一些类似的块与此结构

我的“信息悬停”块在我悬停“项目名称”块之前是隐藏的。但当我将其悬停时，会显示所有“信息悬停”块。如何使“info_hover”块仅在该div处显示我所悬停的内容

HTML代码：

<div class="item_image">
    <img src="" alt="">
    <div class="info_hover">
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt, sapiente! ipsum dolor sit amet.
    </div>
</div>
<div class="item_info">
    <div class="item_name">item_name</div>
    <div class="item_price">item_price</div>
</div>

这应该可以：

   $( ".item_name" ).hover(
      function() {
        $(this).closest(".item_block").find(".info_hover").show();
      }, function() {
        $(this).closest(".item_block").find(".info_hover").hide();
      }
    );

---

您引用

此

，因为您希望访问相对于悬停元素的元素。然后找到一个父元素，该元素同时包含

这个
元素和要访问的元素。在这种情况下，
.item\u block
作为单个项的顶级父项是一种逻辑选择。然后，在父级中找到要访问的元素。最后，您可以根据需要修改元素。
非常感谢！
   $( ".item_name" ).hover(
      function() {
        $(this).closest(".item_block").find(".info_hover").show();
      }, function() {
        $(this).closest(".item_block").find(".info_hover").hide();
      }
    );