在滾動到div的頂部，阿賈克斯將被載入

Question

我目前正在對其中涉及通過jQuery使用AJAX來加載聊天消息的列表，並追加他們在我的模板的div的一個Django的聊天應用程序（如chatmsg_div）。

由於聊天應用程序將被許多用戶所使用，我需要爲我已經成功地這樣做的聊天消息進行分頁。現在，聊天室中只有最後20條聊天消息纔會加載，供用戶查看（最新消息位於div的底部）。

但是，我需要做的是在滾動到chatmsg_div頂部加載聊天記錄（例如以前的20條消息是在另一頁）另一項要求。

我的問題是：

1. 我做了谷歌的一些研究，但找不到任何jQuery的功能，可以讓我在達到特定的div的頂部觸發Ajax調用。我對jquery很新，所以請原諒我，即使我正在尋找的答案是顯而易見的。
2. 加載以前的20條聊天消息後，我想在div留在位置我最後滾動到的不是去div的頂部

到目前爲止，我曾嘗試：

$('#chatmsg_div').scroll(function() { if ($(this).scrollTop() > 100) { debugger; } 
}); 

預先感謝任何人誰可以回答我的問題。

Answer 1

對於檢查是否需要滾動，當新郵件到達，因爲用戶已經滾動到頂部是不可見的，你可以這樣做：

var shouldScroll = (content.scrollTop + content.offsetHeight >= content.scrollHeight); 

凡content是消息

你的DOM容器

爲了檢測如果頁面滾動到最高：

if (content.scrollTop == 0) { 
    // load message history here 
} 

現在，實施新郵件自動滾動和當前SCRO LL是在頁面的底部，你可以這樣做：

if (shouldScroll) { 
    content.scrollTop = content.scrollHeight; 
} 

這應該回答前提是你有足夠的知識做其他任務你所有的問題。無需使用jQuery