将溢出到底部自动函数设置为jQuery脚本

时间:2013-07-23 02:17:32

标签: jquery html

我想添加此功能:

$("#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脚本中? 该函数的逻辑是,如果有任何新数据,它将自动滚动到底部。

感谢。

1 个答案:

答案 0 :(得分:0)

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

$('.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;
});