如何在 Jquery 中选择同一类中悬停的一个

Posted 2023-05-08

【中文标题】如何在 Jquery 中选择同一类中悬停的一个

【英文标题】：How to Choose Hovered One in Same Class in Jquery

【发布时间】：2020-11-20 16:06:05

【问题描述】：

当我将鼠标悬停在任何卡片产品 div 上时，所有卡片产品 div 都会影响。如何只选择悬停的一个？

html：

<div class="card-product">
      <img class="card-product-img" src="anywhere1">
      <img class="card-product-img2" src="anywhere2">
      <div class="card-product-name">T-Shirt</div>
      <div class="card-product-price">39$</div>
</div>

<div class="card-product">
      <img class="card-product-img" src="anywhere3">
      <img class="card-product-img2" src="anywhere4">
      <div class="card-product-name">Shirt</div>
      <div class="card-product-price">49$</div>
</div>

jquery：

$(".card-product").mouseover(function() 
    $(".card-product-img").css("display","none");
    $(".card-product-img2").css("display","block");
);

【参考方案1】：

对于您的 jQuery，您可以这样做...

$(".card-product").mouseover(function() 
    $(".card-product-img", this).css("display","none");
    $(".card-product-img2", this).css("display","block");
);