javascript 使用jQuery获取垂直滚动的最大值

nkcskrwz 于 2023-04-28 发布在 Java

关注(0)|答案(4)|浏览(141)

这是我的视图代码，我用jQuery它的工作，我没有任何问题，直到我改变了屏幕分辨率，它停止工作。我知道问题在哪里，但我无法解决它，看看代码：

@model PNUBOOKIR.Models.ProductModels
@{
    Layout = null;           
}

<!DOCTYPE html>
<html>
<head>

<title>Index</title>
<script src="@Url.Content("~/Scripts/jquery.js")" type="text/javascript"></script>    
<script type="text/javascript">
    var endRun = false;
    var PageNO = 1;
    $(window).scroll(function () {
        if ((($("#container").outerHeight() - 796) == ($(this).scrollTop())) && (!endRun)) {
            endRun = true;
            Load();
        }
    });

    $(document).ready(function () {
        Load();
        return false;
    });

    function Load() {
        var BtnShowMore = document.getElementById("BtnShowMore");
        BtnShowMore.innerHTML = "Loading...";
        $.ajax({ type: "Post",
            url: "Product" + "/" + "GetHomeEventAjax",
            data: "{" + "PageNO" + ":" + PageNO + "}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function succ(data, states) {
                if (states == "success") {
                    if (data.Content != null) {
                        var EventListArea = document.getElementById("result");
                        $('#result > tbody:last').append(data.Content);
                        PageNO = PageNO + 50;
                        BtnShowMore.innerHTML = "More";
                        endRun = false;
                    }
                    else BtnShowMore.innerHTML = "Loading is complete";
                }
            },
            error: function err(result) { alert(result.responseText); }
        });
    }        
</script>
</head>
<body>
    <div id="container">
        <table cellpadding="4" cellspacing="2" border="1" style="width: 450px; direction: rtl;"
            id="result">
            <tbody>
                <tr>
                    <th>کد کالا</th>
                    <th>نام کتاب</th>
                    <th>ناشر</th>
                </tr>
            </tbody>
        </table>
        <a style="width: 200px" id="BtnShowMore">
            Load</a>
    </div>
</body>
</html>

在滚动事件脚本中，我需要找出垂直滚动的最大值是多少，所以我得到了容器的外部高度，但它并不是最大值，它比1280x1024屏幕分辨率中的最大值大796px，它可以在不同的屏幕分辨率设置中有所不同。我需要一些帮助，而不是“796”号码。

JavaScript

来源：https://stackoverflow.com/questions/6027278/getting-the-maximum-value-of-vertical-scroll-using-jquery

4条答案

按热度按时间

zpf6vheq1#

发布的答案不正确;scrollTop不是scrollHeight，而是scrollHeight - outerHeight。
这将为您提供正确的值：

var elem = $("#container");
var maxScrollTop = elem[0].scrollHeight - elem.outerHeight();

赞(0）回复(0）举报 2023-04-28

mlnl4t2r2#

尝试：

$("#container").attr({ scrollTop: $("#container").attr("scrollHeight") });

从jQuery 1开始9.1，你需要：

$("#container").scrollTop($("#container").prop("scrollHeight"));

赞(0）回复(0）举报 2023-04-28

bxjv4tth3#

最好的方法是不使用jQuery。

document.getElementById('container').scrollTop = document.getElementById('container').scrollHeight;

使用jQuery它不适合我，所以如果上面有问题，请尝试这个。

赞(0）回复(0）举报 2023-04-28

kmynzznz4#

var contentHeight = 0;
var scrollBottom = $('#container').scrollTop() + $('#container').height();

$('#container').children().each(function() {
     contentHeight += $(this).height();
});

if (scrollBottom >= contentHeight) {
     // You have reached the bottom, do some stuff.
}

赞(0）回复(0）举报 2023-04-28

我来回答

javascript 使用jQuery获取垂直滚动的最大值

4条答案

相关问题

热门标签

最新问答