jquery - 将溢出设置到底部自动功能到 jQuery 脚本中

Question

我想添加这个功能：

$("#overflow").animate({"scrollTop": $('#overflow')[0].scrollHeight}, "slow");

进入我的 jQuery 脚本：

$('.comment_button').live("click",function() 
{
    var ID = $(this).attr("id");
    var uid = $("#uid").val();
    var comment= $("#ctextarea"+ID).val();
    var dataString = 'comment='+ comment + '&msg_id=' + ID + '&uid=' + uid;

    if(comment=='')
    {
        $('#ctextarea').html("").fadeIn('slow');
        $("#ctextarea"+ID).focus();
    }
    else if (!$.trim($("#ctextarea"+ID).val()))
    {
        $("#ctextarea"+ID).focus();
    }
    else
    {
        $.ajax
        ({
            type: "POST",
            url: "comment_ajax.php",
            data: dataString,
            cache: false,
            success: function(html)
            {
                $("#commentload"+ID).append(html);
                $("#ctextarea"+ID).val('');
                $("#ctextarea"+ID).focus();
            }
        });
    }
    return false;
});

CSS：

#overflow
{
overflow-y: auto;
overflow-x: hidden;
min-height: 50px;
max-height: 246px;
}

和 HTML：

<div class="overflow" id="overflow">
bla bla bla
<div>

我的问题是，如何将该函数放入我的 jQuery 脚本中？该函数的逻辑是，如果有任何新数据，它将自动滚动到底部。

谢谢。

Answer 1

如果我正确理解了您的代码...这样，每次评论中有数据时，您都会滚动到底部。

$('.comment_button').live("click",function() 
{
    var ID = $(this).attr("id");
    var uid = $("#uid").val();
    var comment= $("#ctextarea"+ID).val();
    var dataString = 'comment='+ comment + '&msg_id=' + ID + '&uid=' + uid;

    if(comment=='')
    {
        $('#ctextarea').html("").fadeIn('slow');
        $("#ctextarea"+ID).focus();
    }
    else if (!$.trim($("#ctextarea"+ID).val()))
    {
        $("#overflow").animate({"scrollTop": $('#overflow')[0].scrollHeight}, "slow");
        $("#ctextarea"+ID).focus();
    }
    else
    {
        $.ajax
        ({
            type: "POST",
            url: "comment_ajax.php",
            data: dataString,
            cache: false,
            success: function(html)
            {
                $("#commentload"+ID).append(html);
                $("#ctextarea"+ID).val('');
                $("#ctextarea"+ID).focus();
            }
        });
    }
    return false;
});