Question

我正在为网站的评论系统工作。我在帖子发布后发表评论后使用jquery来更新视图。

我在帖子后推送评论的元素是这样的：

<p class="card-text new_comment_{{$i->id}}" style="display:none"></p>

所以我做的是

//Manages post in view
jQuery(function ($) {
    $(document).ready(function () {

        $("body").on("submit", ".dynamic-form", function (e) {

            var form_id = '#' + $(this).attr('id');
            //removes the 'post_' part from id
            var id = this.id.replace('post_', '');
            var new_comment_class = '.new_comment_' + id;
            var new_comment_class_removal = 'new_comment_' + id;
            var comments_id = '#comments_' + id;
            var form = $(this);

            $.ajax({
                url: form.prop('action'),
                type: 'post',
                dataType: 'json',
                data: $(this).serialize(),
                success: function (data) {

                    var resultStr = "";

                    resultStr = resultStr + "<a href=\"#\">" + data.user_name + " <\/a>" + data.body ;


                    $(comments_id).find(new_comment_class).html(resultStr).slideToggle(150).promise().done(function () {
                        $(new_comment_class).fadeIn("fast").toggleClass(new_comment_class_removal);
                    });

                    $(form_id).slideToggle(150).promise().done(function () {
                        $(form_id).fadeOut("fast");
                    });

                }
            });
            e.preventDefault();
        });
    });
});

所以在执行javascript后，元素会丢失允许我在视图中找到它的类，这样如果用户再次发帖，帖子的主体就不会附加到该元素。但是现在我如何将新的目标元素作为原始目标元素放在新创建的元素之上？像这样：

<p class="card-text new_comment_{{$i->id}}" style="display:none"></p>
<p class="card-text">This is the body of the comment</p>

Answer 1

使用http://api.jquery.com/before/和一些临时变量解决

切换元素类并使用旧类

1 个答案: