javascript - 将新元素添加到可滚动 div 的底部

Question

我试图通过单击 javascript 中的按钮将一个 div 附加到另一个 div 的底部，但是一旦达到外部容器的高度，它不再将列表滚动到底部，插入后.

请参阅fiddle here

如果您单击红色的添加按钮直到列表中出现大约 13 个元素，则 scrollTop 函数似乎出了点问题，并且它不再正常运行(悬停在同一位置附近)。

我对此很迷茫，并且为容器和侧面 div 尝试了一堆不同的 css 设置组合。请帮我。

Answer 1

我已将您的代码重新格式化，使其更像 jQuery。然而，主要的变化是更改 list.scrollTop() 函数，使其只滚动到 list 的底部:

$(document).ready(function() {
    var list = $("#q-d-list");

    $(document).on('click', '#add', function() {
        $('.active', list).removeClass("active");

        var count = list.children().length + 1;
        var active = $('<div />', {
            'data-qid': count,
            'class': 'mli active'
        }).text('q' + count).appendTo(list);

        list.scrollTop(list[0].scrollHeight);
    });
});​

演示:http://jsfiddle.net/MrvcB/19/