鼠标悬停时选择单个链接

Question

我正在尝试使我网站上的超链接具有一定的css动画效果。

我的代码：

$("a").mouseenter(function() {
  this.addClass("myeffect");
}

到目前为止它工作正常，但是当我悬停链接时，网站上的每个链接都会开始显示效果，而不仅仅是我鼠标悬停的效果。 我怎样只有正在徘徊的链接显示效果？

Answer 1

您错误地引用了this。

$("a").mouseenter(function() {
  $(this).addClass("myeffect");
}

Answer 2

简单this返回当前元素/节点。并且没有可用的addClass方法。

您需要从节点中选择该元素并向其添加class。

$(this)将选择该特定元素

＆＃13;

＆＃13;

$("a").mouseenter(function() {
   
  $(this).addClass("myeffect");
})

＆＃13;

.myeffect{
color : red
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<a href="#">1</a>
<a href="#">2</a>
<a href="#">3</a>
<a href="#">4</a>
<a href="#">5</a>

＆＃13;

＆＃13;

＆＃13;