使用jQuery将填充更改为类，但仅单击项

Question

好的，所以很抱歉，如果这个问题再次出现，我真的找不到答案。

O有带有类的菜单，我希望当我单击某些菜单项.menuitem > a ，该链接具有更多paddingBottom。

因此，我设法使用了.click函数和animate函数，但是将填充添加到整个类（所有菜单项）中。 我需要的是仅将填充添加到“已单击”菜单中。

填充所有菜单项的代码（整个类）

$(".menuitem" ).click(function() {
    $('.mainNav > ul > li > a').animate({paddingBottom:"+=17px"});
});

Answer 1

当我单击某些菜单项.menuitem > a ，该链接具有更多paddingBottom

在点击处理程序中，可以通过this引用被点击的特定.menuitem元素。 因此，使用$(this)您可以使用jQuery的DOM遍历方法将元素从该元素移动到要设置动画的相关元素。

如果锚点是您将单击处理程序绑定到的.menuitem元素的子级，则获取对该锚点的引用的最简单方法是使用.find()方法 ：

$( ".menuitem" ).click(function() {
    $(this).find("a").animate({paddingBottom:"+=17px"});
});

Answer 2

您可以使用此关键字来选择您的“ a”标签，然后单击“仅”

$('.menuitem').click(function(){
  $(this).find('a').animate({'padding':'+=17px'});
});

或更具体

 $('.menuitem li').click(function(){
  $(this).find('a').animate({'padding':'+=17px'});
});