.js 的 php 自动滚动问题

Question

是否有任何简单的方法可以在 php/html 聊天框中创建自动滚动？ 我尝试了一些方法，但它们都干扰了页面上的其他 .js 元素，最终都无法正常工作。

查看聊天框的实时代码点击这里！

这就是我现在拥有的东西

// jQuery Document
 $(document).ready(function(){
//If user submits the form
$("#submitmsg").click(function(){   
    var clientmsg = $("#usermsg").val();
    $.post("post.php", {text: clientmsg});              
    $("#usermsg").attr("value", "");
    return false;
});

//Load the file containing the chat log
function loadLog(){     
    var oldscrollHeight = $("#chatbox").attr("scrollHeight") - 20;
    $.ajax({
        url: "log.html",
        cache: false,
        success: function(html){        
            $("#chatbox").html(html); //Insert chat log into the #chatbox div               
            var newscrollHeight = $("#chatbox").attr("scrollHeight") - 20;
            if(newscrollHeight > oldscrollHeight){
                $("#chatbox").animate({ scrollTop: newscrollHeight }, 'normal'); //Autoscroll to bottom of div
            }               
        },
    });
}
setInterval (loadLog, 2500);    //Reload file every 2.5 seconds

//If user wants to end session
$("#exit").click(function(){
    var exit = confirm("Are you sure you want to end the session?");
    if(exit==true){window.location = 'index.php?logout=true';}

});

});

Answer 1

我怀疑你得到的滚动高度的重量不起作用。我尝试在 FF 的命令行中输入它，但没有得到 int 和对象。

不要尝试获取滚动高度。进一步向下滚动......还有更多。

$("#chatbox").animate({ scrollTop: 99999 }, 'normal');

我只尝试过使用 FF，但应该适用于大多数浏览器。

那么，你的成功功能就很简单了：

success: function(html){        $("#chatbox").animate({ scrollTop: 99999 }, 'normal');

            $("#chatbox").html(html);
            $("#chatbox").animate({ scrollTop: 99999 }, 'normal');
}       

$(".msgln").last().offset().top