Question

我试图在填充之前清除ul列表中的元素，即每次使用ajax调用刷新（删除并加载）ul列表，但由于某种原因它不起作用，代码如下所示

<div id="activitycontainer"> <ul id="activitylist" style="list-style: none;padding:0; margin:0;"> </ul> </div>

$(document).ready(function() {
            setInterval(function() {
                autoRefreshCommentsHomePage()
            }, 5000);
        });
        function autoRefreshCommentsHomePage() {
            $.ajax({
                url: 'GetActivity.sc',
                success: function(data) {
                    $(#activitylist).empty();
                    var resultStr = data;
                    var str = '';
                    var temp = '';
                    var ele = resultStr.split('@!@');
                    var arrayLength = ele.length;
                    for (var i = 1; i < arrayLength - 1; i++) {
                        temp = '<li><a href="#">' + 'User1' + ' @</a><span>&nbsp;</span><a>' + ele[i] + '</a></li>';
                        $(temp).appendTo("#activitylist");
                        i = i + 1;
                        temp = '<li><a style="color: black;">' + ele[i] + '</a></li>';
                        $(temp).appendTo("#activitylist");
                        temp = '<li style="float: right;"><a href="#">Comment</a><span>&nbsp;&nbsp;&nbsp;</span><a href="#">Like</a><span>&nbsp;</span></li><br>';
                        $(temp).appendTo("#activitylist");
                        temp = '<br>';
                        $(temp).appendTo("#activitylist");
                    }
                    ;
                }
            });
        };

我正在使用.empty函数清除activitylist ul，当我运行时，发生的事情是没有数据填充在ul中。

如果我删除.empty函数调用，那么ajax每5秒继续加载数据并且我的列表继续增长但我想基本清除现有数据然后加载，这不会发生。

请告知。

Answer 1

我的建议是简单地替换完整的HTML块，而不是在两个单独的步骤中删除/添加。使用jQuery html（）方法。

    function autoRefreshCommentsHomePage() {
        $.ajax({
            url: 'GetActivity.sc',
            success: function(data) {
                // Off topic, but you only need one var statement to declare all these
                var resultStr = data,
                str = '',
                temp = '',
                ele = resultStr.split('@!@'),
                arrayLength = ele.length;

                for (var i = 1; i < arrayLength - 1; i++) {

                    // Note the variable change to +=
                    temp += '<li><a href="#">' + 'User1' + ' @</a><span>&nbsp;</span><a>' + ele[i] + '</a></li>';

                    i = i + 1;

                    temp += '<li><a style="color: black;">' + ele[i] + '</a></li>';
                    temp += '<li style="float: right;"><a href="#">Comment</a><span>&nbsp;&nbsp;&nbsp;</span><a href="#">Like</a><span>&nbsp;</span></li><br>';
                    temp += '<br>';

                }

                // Replace it all at once
                $('#activitylist').html(temp);
                ;
            }
        });
    }
    ;

清除ul内的元素

1 个答案: