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

Question

当我将鼠标悬停在任何卡片产品 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");
});

Answer 1

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

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