針對與jQuery的特定類

Question

我試圖在jQuery中顯示隱藏的類，但它不適用於我定位的類。它顯示了全班同學：

<div class="feeds"> 
    <input class="post_id" /> 
    <textarea class="commentdata"></textarea> 
    <button class="mmore">More</button> 
    <p class="time">time</p> 
    <div class = "comment_data"> 
    <div class = "comment"> 
     <p> Comments </p> 
    </div> 
    </div> 
</div> 

<div class="feeds"> 
    <input class="post_id" /> 
    <textarea class="commentdata"></textarea> 
    <button class="mmore">More</button> 
    <p class="time">time</p> 
    <div class = "comment_data"> 
    <div class = "comment"> 
     <p> Comments </p> 
    </div> 
    </div> 

<div class="feeds"> 
    <input class="post_id" /> 
    <textarea class="commentdata"></textarea> 
    <button class="mmore">More</button> 
    <p class="time">time</p> 
    <div class = "comment_data"> 
    <div class = "comment"> 
     <p> Comments </p> 
    </div> 
    </div> 
</div> 

類comment_data是display: none默認情況下，每當被點擊的更按鈕只顯示。工作，但它顯示的所有評論3 div。

這是我的jQuery代碼：

$(".mmore").click(function() { 
    $('.comment_data').slideToggle("slow"); 
}); 

Answer 1

$('.mmore').click(function() { 
    $(this).parents('.feeds').find('.comment_data').slideToggle('slow') 
}); 

Answer 2

你選擇的選擇.comment_data匹配的所有對象。

您需要將其限制在單擊按鈕所在的同一容器中。有多種方法可以實現此目的。一個簡單的一個是：

$(".mmore").click(function() { 
    $(this).parent().find('.comment_data').slideToggle("slow"); 
}); 

Answer 3

您可以使用.closest()找到.feeds格，然後用.find()爲* .comment_data *格

$('.mmore').click(function() { 
    $(this).closest('.feeds').find('.comment_data').slideToggle('slow') 
});