jQuery在父级上为多个相似元素切换类动画

Question

我有一系列div，我正在使用css来制作动画。每个div都有一个按钮，用于触发css动画。我想使用jQuery将一个css过渡类添加到div中，以便它独立动画。诀窍是我需要允许多个div一次激活/动画/ up。我想为每个实例使用相同的js，但我希望div独立行动而不会相互影响。我正在使用：

$(".show").click(function() { 
    $(".show").parent().toggleClass('rise');
    });

这就是我现在所拥有的：

http://codepen.io/interwebjill/pen/PzZzMW

Answer 1

试试此代码

$(".show").click(function(event ) { 
  $( event.target).closest("div").toggleClass('rise');
});

Answer 2

看一下你的代码，这就是我的建议：

$('#card-container').find.(".show").click(function() {
  $(this).closest('.card').toggleClass('rise');
});

• 这会限制事件绑定到卡片容器，以防页面上的其他某些元素使用show类
• 如果show`链接嵌套深度超过第1级，则使用closest代替parent