Javascript 如何从laravel blade循环中获取jQuery的变量类名

Javascript 如何从laravel blade循环中获取jQuery的变量类名,javascript,php,jquery,laravel,loops,Javascript,Php,Jquery,Laravel,Loops,我想显示/隐藏每个评论的回复。为了做到这一点,我的jQuery选择器必须是变量类名,这样我就可以显示/隐藏特定注释的回复,而不会影响其他注释的回复。我已经编写了PHP代码,在类中添加了注释id,以使类不同。但是我从LaravelBlade循环中获得了这些ID,我不知道如何在jQuery中做到这一点。这是我的blade.php- @foreach($comments as $comment) <div class="box-comment"> <div class="

我想显示/隐藏每个评论的回复。为了做到这一点,我的jQuery选择器必须是变量类名,这样我就可以显示/隐藏特定注释的回复,而不会影响其他注释的回复。我已经编写了PHP代码,在类中添加了注释id,以使类不同。但是我从LaravelBlade循环中获得了这些ID,我不知道如何在jQuery中做到这一点。这是我的blade.php-

@foreach($comments as $comment)
  <div class="box-comment">
    <div class="comment-text">
      {{$comment->body}}<br />
      <button class="btn btn-link text-muted toggle-replies-{{$comment->id}}">Show/Hide Replies</button>
    </div> <!-- /.comment-text -->
  </div> <!-- /.box-comment -->
  <div class="box-comment reply-box-{{$comment->id}} initially-hidden" style="padding-left: 30px;">
    <input type="text" placeholder="Write a reply...">
  </div>
  @foreach($comment->replies as $reply)
    @if($comment->id == $reply->comment_id)
      <div class="box-comment reply-box-{{$comment->id}} initially-hidden" style="padding-left: 30px;">
        <div class="comment-text">
          {{$reply->body}}
        </div> <!-- /.comment-text -->
      </div> <!-- /.box-comment -->
    @endif
  @endforeach                      
@endforeach            
这是jQuery:

<script>
$(document).ready(function() {
  $(".toggle-comments").click(function(){
    $(".comment-box").slideToggle();
  });

  $(".toggle-replies-1").click(function(){
    $(".reply-box-1").slideToggle();
  });
});  
</script>
我已经手动将“1”放在那里,它显示/隐藏第一条评论的回复。我需要为所有的评论做这件事。这应该不难,但我仍在学习jQuery。我希望有人能帮我。试试这个:

@foreach($comments as $comment)
    <div class="box-comment">
        <div class="comment-text">
            {{$comment->body}}<br />
            <button class="btn btn-link text-muted show_hide_replies" id="{{$comment->id}}">Show Replies</button>
        </div>
    </div>
    <div class="box-comment reply-box-{{$comment->id}} initially-hidden" style="padding-left: 30px;">
        <input type="text" placeholder="Write a reply...">
    </div>
    @foreach($comment->replies as $reply)
        @if($comment->id == $reply->comment_id)
            <div class="box-comment reply-box-{{$comment->id}} initially-hidden" style="padding-left: 30px;">
                <div class="comment-text">
                    {{$reply->body}}
                </div>
            </div>
        @endif
    @endforeach                      
@endforeach            

<script type="text/javascript">
$(document).ready(function() {
    $(".toggle-comments").click(function(){
        $(".comment-box").slideToggle();
    });

    $(".show_hide_replies").click(function(ev) {
        var getElem = $(this).attr("id");
        $(".reply-box-"+getElem).slideToggle()
        $(this).text(function(i, text){
            return text === "Show Replies" ? "Hide Replies" : "Show Replies";
        })
    })
});  
</script>

谢谢,它工作正常。你能再帮我一点忙吗?我想更改切换上的按钮文本。如果显示回复,我希望按钮显示隐藏回复。否则它应该说显示回复