Rumah >hujung hadapan web >tutorial js >Bagaimana untuk Memastikan Div Ditatal ke Bawah dalam Aplikasi Sembang?

Bagaimana untuk Memastikan Div Ditatal ke Bawah dalam Aplikasi Sembang?

Mary-Kate Olsen
Mary-Kate Olsenasal
2024-12-13 10:04:09421semak imbas

How to Keep a Div Scrolled to the Bottom in a Chat Application?

Menatal ke Bahagian Bawah Div

Dalam aplikasi sembang yang dibina dengan permintaan Ajax, menatal div mesej ke bahagian bawah adalah penting. Untuk mencapai matlamat ini, kami boleh memanfaatkan pelbagai teknik JavaScript.

Memastikan Div Ditatal ke Bawah secara Lalai

Untuk div dengan ID "tatal" dan ketinggian yang ditentukan dan limpahan, kita boleh menggunakan JavaScript berikut untuk memastikannya ditatal ke bawah pada mulanya:

var scrollDiv = document.getElementById("scroll");
scrollDiv.scrollTop = scrollDiv.scrollHeight;

Menatal ke Bawah Selepas Permintaan Ajax

Selepas permintaan Ajax berjaya mendapatkan semula mesej baharu, kami perlu melaraskan kedudukan skrol div dengan sewajarnya:

function updateMessages() {
    var scrollDiv = document.getElementById("scroll");
    scrollDiv.scrollTop = scrollDiv.scrollHeight;
}

Fungsi ini boleh dilampirkan sebagai panggilan balik ke Ajax acara "kejayaan" permintaan. Ia akan memastikan bahawa div menatal ke bawah selepas setiap set mesej baharu dimuatkan.

Atas ialah kandungan terperinci Bagaimana untuk Memastikan Div Ditatal ke Bawah dalam Aplikasi Sembang?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn