0

インデックス ファイルに投稿のリストがあります。すべての投稿で、コメントが必要です。すべての投稿にコメントを表示というボタンがあります。コメントの表示を押すと、jquery が特定の投稿でそのコメント ボックスをトリガーするようにします。

問題は、ページ全体ですべてのショーコメントをトリガーすることです。

これが私のコードです：

問題はスクリプトにあると思います。

    <% @posts.each do |post| %>
<div class="span6">
  <h4><%= post.title %></h4>
  <p><%= post.text %></p>
   <p><%= link_to "Go to", post_path(post) %></p>

<button class="btn btn-large btn-block btn-primary comments-show-button"  type="button">Show comments</button>
        <button id="remove-button" class="btn btn-large btn-block btn-primary" type="button">Remove comments</button>
    <div class="comments">
        <div class="fb-comments" data-href="http://example.com" data-width="430"></div>
    </div>  
</div>
<% end %>
    </div>
</div>


<script>
 $(document).ready(function(){

  $(".comments-show-button").click(function(){
$(".comments").show(500);
$("#remove-button").show(500);
 $(".comments-show-button").hide();
 });
$(".comments").mouseout(function(){
$("#comments-show-button").hide();
 });

});
</script>

ご協力いただきありがとうございます！

4

1 に答える 1

0 
$(document).ready(function(){
    $(".comments-show-button").click(function() {
        var $thisPost = $(this).closest('div.span6');
        var $comments = $thisPost.find('div.comments');
        $comments.show(500);
        $thisPost.find("#remove-button").show(500);
        $thisPost.find(".comments-show-button").hide();
    });
    $(".comments").mouseout(function(){
        $("#comments-show-button").hide();
    });
});
于 2013-08-19T12:02:39.847 に答える