问题：

Question

我正在创建一个小博客应用程序来学习Rails - 用户可以登录，创建帖子和评论其他用户的帖子。现在我正在添加Ajax到“添加你的评论”页面并在途中遇到一些设计问题。页面流程如下所示：

# post section
 :post.title here
 :post.username here
 :post.created_at here
 :post.body here

# comments section (sorted by date of creation):
:number of comments here

:first comment
:second comment
...
:last comment

# add comment section
:text_area here
:submit button here

问题：

1 - 评论按创建日期排序，因此我的ajax调用会添加新评论到页面顶部。如果我改变了排序行为，那么ajax代码就会破坏。

2 - 评论 div 可以有3个css类：.odd，.even或.admin（如果评论由管理员用户发出，则应用周期奇数/偶数或管理员）。现在我正在努力编写这些类名，并使用一些if来获得正确的名称。这也很糟糕，如果更改了css类名，那么ajax代码就会破坏。

我如何避免这些事情，或至少改善？这是我的create.js.erb：

var div = $('#comments_div');
var comment_class = div.children().first().attr('class')
var new_class;

<% if current_user.admin == 1 %>
    new_class = 'comment_body_admin'
<% else %>
if (comment_class === 'comment_body_odd')
    new_class = 'comment_body_even'
else
    new_class = 'comment_body_odd'
<% end %>

var new_div = $('#comments_div').prepend("<%= j render @comment %>");
new_div.children().first().attr('class', new_class)

感谢您的帮助！

Answer 1

1 - 除了撤销订单中创建的评论排序外，您如何更改评论排序？在这种情况下，您需要让create.js.erb知道排序顺序并使用append而不是prepend。

2 - 为管理员应用'admin'类，但将奇偶条带留给CSS。像这样的东西应该这样做：

.comment:nth-child(2n) { background: #eeeeee; }

在将节点插入DOM之前构建节点并操纵其属性也更有效：

var comment = $("<%= j render @comment %>").addClass('comment')
comment.addClass(new_class)
$('#comments_div').prepend(comment)

Rails - 添加AJAX时减少耦合

问题：

1 个答案: