Question

我有一个用户使用的活动流和站点范围的视图。目前，当用户发布更新时，我会显示默认的引导成功警报。我已经看到其他网站通过向下滑动现有项目并将最新帖子附加到列表顶部来将新帖子附加到列表中。

我试图这样做，但我不确定如何添加所有适当的样式。 （以下代码）。我尝试添加构成Feed中一个活动项目的所有<div>代码，但没有成功。

TL; DR - 有没有办法让ajax查看当前的顶级活动项目，克隆它，并将其附加到顶部？这将使代码更具动态性，并避免将CSS放在.js文件中。

jQuery(document).ready(function ($) {

    $('form#postActivity').submit(function (event) {
        event.preventDefault();

        $postActivityNow = (this);
        var subject = $('#activity_subject').val();
        var message = $('#activity_content').val();

        var data = {
            'action': 'postAnActivity',
            'subject': subject,
            'message': message,
        }


        $.ajax({
            type: 'post',
            url: postAnActivityAjax.ajaxurl,
            data: data,
            error: function (response, status) {
                alert(response);

            },
            success: function (response) {
                if (response.success) {
                    bootstrap_alert.success('Activity Added');
                } else {


                    if (response.data.loggedIn == false) {
                        bootstrap_alert.warning('you are NOT logged in');
                        console.log('you are not logged in')
                    }
                    if (response.data.userExists == false) {
                        console.log(response);
                        bootstrap_alert.warning(response.data.alertMsg);
                        console.log(response.data.alertMsg)
                    }

                }

            }

        });
    });
});

Answer 1

克隆元素：jQuery.clone()

var newItem = $("#myDiv").clone();

将其作为第一个孩子附加：jQuery.prepend()

$("#parentDiv").prepend( newItem );

此致 hotzu

Answer 2

我过去已经使用$ .prepend（）

完成了

查看此网址以获取更多信息jquery append to front/top of list

Answer 3

您也可以使用.prependTo()

var newActivity = $( ".activity" ).first().clone();    
newActivity.prependTo( ".parentDiv").hide().slideDown();

FIDDLE

在post-layout相关后，使用Ajax将项添加到列表中

3 个答案: