在悬停父元素时使用 (this) select class 的特定实例

Question

我正在尝试使用 jQuery 来更新子 "slide-atc" class 的特定实例的 css 当用户将鼠标悬停在其父元素上时"slide-block" class.

我唯一的限制是不能直接编辑 HTML。这是我正在尝试的一些代码，但我认为我没有正确使用 .this()

  $(".slide-block").hover(function(){
    $(this).(".slide-atc").css("bottom", "0px");
    }, function(){
    $(this).(".slide-atc").css("bottom", "-70px");
  });

<div class="slide-block">
            <div class="slide-atc">

        </div>
    </div>

非常感谢任何帮助！

Answer 1

您的代码有语法错误：您需要链接 .find() 才能 select 嵌套的子项，即：

$(this).find(".slide-atc").css("bottom", "0px");

或者，您可以提供 this 作为 jQuery 中的第二个参数 select 或：

$(".slide-atc", this).css("bottom", "0px");

Answer 2

请尝试使用不带 $ 符号的 "this"。单词 "this" 是对作为事件源的 DOM 本身中的 html 元素的引用。另一方面，“$(this)”是围绕该元素的 jQuery 包装器，可以使用其他 jQuery 方法。另外，我认为你在第 4 行有一个错误，因为第二个参数不是背景颜色。

在悬停父元素时使用 (this) select class 的特定实例

Using (this) to select a specific instance of a class while hovering a parent element

javascript

css

jquery

this