Question

我有一个ul，在AJAX请求后会附加几个li。列表中的前面元素被删除了，为什么会这样？

AJAX调用函数：

var $comments = $('.comments').find('ul');

$comments.text('Loading...');

    $.ajax({
        type: 'get',
        url: 'http://localhost/codeigniter/',
        success: function(result){

            if (result == 0){
                $comments.text('No comments.');

                return;
            }                           

            $comments.text('');

            display_comments(result);
        }
    });

列表显示功能：

function display_comments(result){
var result_comments = JSON.parse(result);   

var $ul = $('.comments').find('ul');

for (var i = 0; i < comments.length; i++){

        // Insert comments
        lis += '\
            <li>\
                ' + comments[i].title + '\                  
                <p>' + comments[i].description +'\
            </li>';
    }

$ul.append(lis);
}

Answer 1

因为这个

$comments.text('Loading...');

和这个

$comments.text('No comments.');

和这个

$comments.text('');

发生这种情况的原因是jQuery的.text()方法会覆盖匹配元素的内容。在ul的情况下，其内容是任何子li。因此，当您开始加载列表项时，ul变为：<ul>Loading...</ul>

使用JQuery追加元素删除以前的元素

1 个答案: