jQuery的隐藏仅此回复

Question

我有这样的jQuery代码在这里：

$(".replies_hide").click(function(e) { 
    $(".replies_show").show(); // This is only button code. Not replies 
    $(".replies").hide(300); // I need to hide only these replies. Not all replies 
    e.preventDefault(); 
}); 

当我点击“显示回复”按钮，它让我看到了具体的意见的答复。但是，当我点击“回复_隐藏”时，它会立即关闭所有回复。如何只隐藏我刚刚打开的回复？

HTML：

 <ul class="list-unstyled replies"> 
     <a class="replies_hide" href="#">Hide replies</a> 
     @foreach($com->reply as $reply) 
     <li style="margin-left: 5%"> 
     <img src="http://flipbit.co.uk/content/images/blog/build-avatar.jpg" style="height: 30px"> 
     <strong>{{$reply->user->name}}</strong> 
     {!! strtr(strip_tags($reply->reply), $emotes) !!}<br> 
     <small>{{$reply->created_at}}</small> 
     @if(Auth::user()->id == $reply->user_id) 
     <a href="/trinti-atsakyma/{{$reply->id}}">Trinti</a> 
     @endif 
     </li> 
     @endforeach  
     </ul> 

Answer 1

随着你的HTML标记，似乎要隐藏仅包含hide按钮，你点击和相关答复ul块所以你需要找到最接近ul块按钮你点击了。

要做到这一点，你可以使用：

$(this).closest(".replies").hide(300); 

它会得到自行测试元素和DOM树向上遍历通过它的祖先选择相匹配的第一个元素。

Answer 2

这是发生，因为你是隐藏回复类的所有元素。你必须只隐藏你所在的html元素。试试这个：

$(this).hide();