使用 (this) 在悬停父元素时选择类的特定实例

Question

当用户将鼠标悬停在“slide-block”类的父元素上时，我试图使用 jQuery 来更新子“slide-atc”类的特定实例的 css。

我唯一的限制是我不能直接编辑 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()才能选择嵌套的子项，即：

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

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

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

Answer 2

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