Javascript 如何在一个<；a>；？

我希望

div

在悬停时更改背景。但是当

div

中的文本悬停时，它不会改变背景。 这是我尝试过的，但是所有的背景

div

s都改变了。我还尝试了

a>img

，而不是在我的处理函数中只使用

img

，但根本不起作用

function handlerIn() {
    $("img").css({"opacity":1});
}

function handlerOut() {
    $("img").css({"opacity":0});
}

$("a").mouseenter(handlerIn).mouseleave(handlerOut);

---

a>img

不起作用，因为

img

不是

a

（

parent>child

）的子代而是子代（

achestor子代

）

因此，您的css规则应该如下所示：

a:hover  img {
  opacity: 1;
}

因此，您根本不需要jQuery，但是如果您想使用jQuery，那么您需要使用事件发生的

a

元素作为根来搜索

img

元素，否则您将找到所有

img

元素

function handlerIn() {
  $(this).find('img').css({
    "opacity": 1
  });
}

function handlerOut() {
  $(this).find('img').css({
    "opacity": 0
  });
}

$("a").mouseenter(handlerIn).mouseleave(handlerOut);

---

您不需要jquery来完成这项工作

它可以通过css完成：

#kpop:hover, #fashion:hover, #martialarts:hover, #nature:hover{
  background: url('http://www.dike.lib.ia.us/images/sample-1.jpg/image_preview');
}

---

我不确定这是否正确，为什么不使用hover（）函数？

---

此OP包含3个问题-1。）如何将h1作为目标？2.）我希望div在悬停时更改背景。3.）我还在处理函数中尝试了一个>img，而不仅仅是img，但根本不起作用。这是哪一个？需要明确的是，OP的事件处理程序正在为所有

img

元素触发。他们只想触发用户使用mouseenter/mouserleave激活的元素。a中的h1与什么有关系？

悬停

只是

的一个简短形式。mouseenter（…）.mouseleave（…）

如果您使用其中一个或另一个，则不会产生任何影响。在您将代码从

$（“img”）.css（{“opacity”：1}）更改之前

到

$（this.find（“img”）.css（{“opacity”：1}）

它也不起作用，所以解决方案不是

hover（）

，而是

$（this.find（“img”）

。如果你写了一个答案，那么请在答案中包含你的代码，而不仅仅是链接到它。