如何在jScrollPane中获得最大滚动高度?

时间:2010-12-03 19:10:57

标签: javascript jquery ajax jquery-plugins jscrollpane

jScrollPane是一个非常棒的jQuery插件,可以修改默认的浏览器滚动条。我正在开发一个将使用jScrollPane的聊天应用程序。到目前为止它工作得很好,除了我无法确定最大滚动高度的事实。这是我正在尝试做的事情:

$(function ()
{
    $('#chatPane').jScrollPane();
    var api = $('#chatPane').data('jsp');
    setInterval(function ()
    {
        $.ajax(
        {
            url: "Home/GetMessage",
            type: "POST",
            success: function (response)
            {
                // This next line is where the issue occurs. I need to check if the current scroll position is equal to the max scroll position. This is to implement the auto scroll if the user has scrolled to the bottom of the chat.
                var atBottom = (api.getContentPane().getContentPositionY() == api.getContentPane().getMaxScrollHeight()??????);
                api.getContentPane().append(response);
                api.reinitialise();
                if (atBottom)
                    api.scrollToBottom();
            },
            error: function (xhr, textStatus, errorThrown)
            {
                alert(textStatus);
            }
        });
    }, 1000);
});

getMaxScrollHeight不存在。我需要一些方法来确定最大滚动高度。

编辑:我让它对ajax成功函数进行了以下更改。但是,如果有人知道比滚动到底部更好的方式,获得当前位置,然后滚动回到之前的位置,将非常感激。

            success: function (response)
            {
                var currentPosition = api.getContentPositionY();
                api.scrollToBottom();
                var maxPosition = api.getContentPositionY();
                api.scrollToY(currentPosition);
                var atBottom = (currentPosition == maxPosition);
                api.getContentPane().append(response);
                api.reinitialise();
                if (atBottom)
                    api.scrollToBottom();
            }

2 个答案:

答案 0 :(得分:1)

您可以尝试的一种解决方案是模拟scrollToBottom(),然后将结果getContentPositionY()与模拟前的值进行比较。如果它没有改变,那么用户已经在底部,所以在追加响应内容后,请将scrollToBottom()“改为真实”。

要运行模拟,您可以尝试克隆原始对象,然后在内存中进行修改。有关详细信息,请参阅http://api.jquery.com/clone/。例如:

var simulatedPane = $('#chatPane').clone();
simulatedPane.jScrollPane();
var simulatedApi = simulatedPane.data('jsp');

然后,在success()函数中,使用simulatedApi进行模拟。

答案 1 :(得分:1)

我看到你已经有了解决方案。另一种方法可能是为jsp-scroll-y事件添加一个监听器:

http://jscrollpane.kelvinluck.com/events.html

此侦听器获取isAtTop和isAtBottom的布尔值。您可以将其存储在变量中,并在重新初始化滚动窗格之前检查变量的状态。

从长远来看,如果您可以添加功能请求以向API添加其他方法,那就太棒了:isAtTopisAtBottomisAtLeftisAtRight - 如果你将其添加到github issues list,那么我会在有机会时添加它。