javascript - 如何在 jScrollPane 中获取最大滚动高度?

标签 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();
            }

最佳答案

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

要运行模拟,您可以尝试克隆原始对象,然后在内存中修改它。参见 http://api.jquery.com/clone/获取更多信息。例如:

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

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

关于javascript - 如何在 jScrollPane 中获取最大滚动高度?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4349002/

相关文章:

javascript - 单击带有 phantom.js 的链接并检索文档 html

javascript - 将 AddThis 添加到 React 组件

javascript - 可以使用通配符调用 Javascript 中的变量吗?

JQuery Unslider 插件问题

javascript - 如何从jquery数据表中的ajax调用获取动态列标题和结果

php - 使用 CodeIgniter 对 Controller 的 AJAX 调用不成功

javascript - 如何将新建的PDF发送到浏览器?

javascript - 使用 javascript/lodash 对特定键的相同值进行分组并对它们进行计数并将结果返回到数组

javascript - 更改 Canvas 上的文本阴影样式

javascript - 数据包含在一个数组/json中,想通过DOM注入(inject)到页面中,jQ有模板吗?