0

我在每个帖子下都有评论。所有的帖子和评论都可以通过链接/用户/用户名看到

我正在使用 facebox（基于 jQuery 的灯箱）作为弹出窗口，并且评论显示得很好。唯一的问题是弹出窗口中只显示最新帖子的评论。所有弹出链接都显示相同的注释。

例如，如果最新帖子有 5 条评论，我可以单击帖子下方的评论链接以在弹出窗口中查看。但是，当我向下滚动并转到另一个有 1 条评论的帖子时，当我单击评论链接时，我会看到相同的 5 条评论。如何确保只显示与特定帖子相关的评论？

这是我的 show.html.erb

<script src="/jquery.js" type="text/javascript"></script>
<link href="/src/facebox.css" media="screen" rel="stylesheet" type="text/css"/>
<script src="/src/facebox.js" type="text/javascript"></script> 
<script language="javascript">

 jQuery(document).ready(function($) {
  $('a[rel*=facebox]').facebox() 
}) 
</script>

<% provide(:title, @user.name) %>
<div class="row">
  <aside class="span4">
    <section>
      <h1>
        <%= gravatar_for @user %>
        <%= @user.name %>
      </h1>
    </section>
    <section>
      <%= render 'shared/stats' %>
     </section>
  <br>
  </aside>
 <br>

  <div class="span10">
    <%= render 'follow_form' if signed_in? %>
    <% if @user.microposts.any? %>
      <h3>Browse</h3>
      <ol class="microposts">
        <%= render @microposts %>
      </ol>
      <%= will_paginate @microposts %>
    <% end %>
  </div>
  </div>

我的 micropost.html.erb 评论视图位于底部

<li>

 <%= render 'shared/comment_form', micropost: micropost if signed_in?%>
 <div id ="modal" class = "comments">
  <% micropost.comments.each do |comment| %>
  <%= image_tag("http://www.gravatar.com/avatar.php?gravatar_id=#{Digest::MD5::hexdigest(comment.user.email)}", :alt => 'Avatar', :class => 'avatar', :height => "10%", :width => "10%") %> <!-- Retrieves Gravatar -->
    <%= link_to comment.user.name, comment.user %>
          <span class="timestamp"><%= time_ago_in_words(comment.created_at) %> ago</span>
    <span class="content2"><%= comment.comment_content %></span>
    <% end %></div>
</li>

最后是comment_form.html.erb

<%= form_for([micropost, @comment]) do |f| %>
<%= render 'shared/error_messages', object: f.object %>
  <div class="field">
    <%= f.text_field :comment_content %>
  </div>
  <div class="ItemContainer">
<div class="ItemInput">
    <button class="btn" type="submit">
    Comment
  </button>
  </div><div class="ItemCommentCount">
<% end %>

<%= link_to "#modal", :rel => "facebox-#{micropost.id}" do %>
  Comments
<% end %></div></div>
4

1 回答 1

0

从精细规范：

身份证=身份证

元素的唯一标识符。

文档中不能有多个元素具有相同的 id 值。

您有多个<div id="modal">元素：

<div id ="modal" class = "comments">

在您的页面中。由于ids 应该是唯一的，因此对 an 的 DOM 搜索id通常只会找到第一个；您总是会收到第一个微博的评论，并且当您有重复id的 s 时，这与预期的行为相匹配。

一个简单的解决方案是micropost.id在 DOM中包含id：

<div id="modal-<%= micropost.id %>" class="comments">

然后在链接中：

<%= link_to "#modal-#{micropost.id}", :rel => "facebox-#{micropost.id}" do %>
  Comments
<% end %>
于 2013-03-14T23:39:14.223 回答