jQuery在父類中爲多個類似元素切換類動畫

Question

我有一系列的div，我使用css來動畫。每個div都有一個觸發css動畫的按鈕。我想使用jQuery向div添加一個css轉換類，以便它獨立地進行動畫處理。訣竅是我需要允許多個div一次激活/動畫。我想爲每個實例使用相同的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

看了看你codepend，這就是我'd推薦：

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

• 這限制了事件綁定到卡，容器，以防萬一在頁面上一些其他的元素使用show類
• 並採用closest而不是parent萬一show`鏈接比第一級
嵌套更深