1

这是我目前正在使用的代码：

$.ajax({
    success: function(){
        $('.post_container').append('test <br />');
    }
});
<% sleep 1 %>

它类似于我用于单个主微帖子表单的代码，但是有几个使用相同类的评论，因此测试将应用于所有 post_containers 而不是刚刚发布帖子的那个。“测试”文本最终将替换为包含用户发布的实际评论的 div。

通常我会使用“this”，但这在这里不起作用。

HTML：

<div class="post_content">
    <div class="post_container">
        <div class="userNameFontStyle">
            <%= link_to current_users_username.capitalize, current_users_username %> -
            <div class="post_time">
                <%= time_ago_in_words(m.created_at) %> ago.
            </div>
        </div>  
        <%=  simple_format h(m.content) %>
    </div>
    <% if m.comments.any? %>
    <% comments(m.id).each do |comment| %>
    <div class="comment_container">
        <%= link_to image_tag(default_photo_for_commenter(comment), :class => "commenter_photo"), commenter(comment.user_id).username %>
        <div class="commenter_content">
            <div class="userNameFontStyle">
                <%= link_to commenter(comment.user_id).username.capitalize, commenter(comment.user_id).username %> - <%=  simple_format h(comment.content) %>
            </div>
        </div>
        <div class="comment_post_time">
            <%= time_ago_in_words(comment.created_at) %> ago.
        </div>
    </div>
    <% end %>
    <% end %>
    <% if logged_in? %>
    <%= form_for @comment, :remote => true do |f| %>
    <%= f.hidden_field :user_id, :value => current_user.id %>
    <%= f.hidden_field :micropost_id, :value => m.id %>
    <%= f.text_area :content, :placeholder => 'Post a comment...', :class => "comment_box", :rows => 0, :columns => 0 %>
    <div class="commentButtons">         
        <%= f.submit 'Post it', :class => "commentButton" %>
        <div class="cancelButton">
            Cancel
        </div>
    </div>   
    <% end %>
    <% end %>
    </div>
</div>

我将如何处理？

亲切的问候

4

2 回答 2

0

新的：

$(function() {
    $('.post-form').submit(function(){
        var $post_content = $(this).find('.post_content');

        $.ajax({
            url: this.attributes['action'],
            data: $(this).serialize(),
            success: function() {
                $post_content.append('test <br />');
            }
        })
        return false; //this will stop the form from really submitting.
    });
});

这应该可以满足您的需求。只需在任何地方包含此 javascript。

老的：

$('form').submit(function(){
    $.ajax({
        url: this.attributes['action'],
        data: $(this).serialize(),

        //the below line might need to be adapted.
        var post_content = $(this).find('.post_content');

        success: function() {
            $(post_content).append('test <br />');
        }
    })

这假设页面上只有一个表单。但是，要使代码完全工作，我需要知道如何区分哪个 .post_content 是“提交的”post_content。您如何以编程方式确定这一点？每个 post_content 是否有不同的按钮？还是每个 post_content div 周围有不同的形式？无论哪种方式，您都必须以某种方式将其包含到 js 代码中。

于 2012-04-11T01:25:56.690 回答
0

这就是我最终不得不这样做的方式。

.new_comment 是我的表单 ID

$('.new_comment').on('ajax:success', function(){
    $(this).parent('.post_content').find('.comment_container:last').after("<BR />TEST <BR />");

});

<% sleep 1 %>

现在唯一的问题是为刚刚发布的帖子识别实际的comment_container。

于 2012-04-11T23:03:07.370 回答