1

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';}

});

}）;

4

1 に答える 1

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

于 2012-09-18T13:27:09.987 に答える