Question

我有一个带滚动的网络文档。我想获得当前滚动位置的值（以像素为单位）。当我运行以下函数时，它返回零值。我怎么能这样做？

<script type="text/javascript" src="js/jquery-1.7.2.js"></script>
<script type="text/javascript" src="js/jquery.mousewheel.min.js"></script>
<script type="text/javascript">
    $(function (){
        $('#Eframe').on("mousewheel", function() {
            alert(document.body.scrollDown)
        }
    })
</script>

Answer 1

因为看起来你正在使用jQuery，所以这是一个jQuery解决方案。

$(function() {
    $('#Eframe').on("mousewheel", function() {
        alert($(document).scrollTop());
    });
});

这里解释不多。如果您愿意，这里是the jQuery documentation。

Answer 2

最好使用$(window).scroll()而不是$('#Eframe').on("mousewheel")

如果人们使用滚动条上的向上和向下箭头手动滚动或抓取并拖动滚动条本身，

$('#Eframe').on("mousewheel")将不会触发。

$(window).scroll(function(){
    var scrollPos = $(document).scrollTop();
    console.log(scrollPos);
});

如果#Eframe是一个包含overflow:scroll的元素，并且您想要它的滚动位置。我认为这应该有效（尽管我还没有测试过）。

$('#Eframe').scroll(function(){
    var scrollPos = $('#Eframe').scrollTop();
    console.log(scrollPos);
});

Answer 3

纯JavaScript可以做到！

var scrollTop = window.pageYOffset || document.documentElement.scrollTop;

如何在jQuery中获取浏览器滚动位置？

3 个答案: