クリックされた要素の親の中にあるクラスを見つけよう

Question

私は、クリックされた要素の親の内部で.post-infoクラスを見つけようとしています。今、ページ上のすべての。post-infoが切り替わります。私はその1つの.post-infoを取得して、親コンテナの.postの内部をトグルしようとしています。

<div class="post"> 
<div class="toggle-info">Toggle Btn</div> 

<div class="post-info"> 
    <p>Toggle this content</p> 
</div> 

</div> 


$(".toggle-info").click(function() { 
    $(".post-info").animate({ 
    height: "toggle", 
    opacity:"toggle" 
    }, 520, 'swing'); 
}); 

ありがとうございました！

Answer 1

あなたはこのようにそれを行うことができます。

$(this).closest(".post").find(".post-info").animate(...) 

これは、クリックが発生し、.postクラスを見つけ、そこから親チェーンを上がると、その親で.post-infoを見つけ、それにアニメーションを適用します。これは.post-infoが.postの親のどこにあっても動作するという点で非常に柔軟です。あなたはそれはここで働いて見ることができます：http://jsfiddle.net/jfriend00/AeYZU/

を、この特定の正確なHTMLのために、あなたもこれを使用することもできます。

$(this).next().animate(...) 

これがクリックされたdiv要素の後に次の兄弟になるだろう。このメソッドは（前のものとは対照的に）次の兄弟として.post-infoの正確な位置に依存し、位置が変わると壊れます。あなたはここでこの1つの作品を見ることができます：http://jsfiddle.net/jfriend00/qGCLx/