javascript $(文档).scrollTop()始终返回0

oymdgrw7  于 2022-12-25  发布在  Java
关注(0)|答案(9)|浏览(158)

我只是想在页面滚动到一定高度时做些什么,但是无论我向下滚动多远,scrollTop()都返回0或null,这是我用来检查scrollTop()值的帮助函数:

$('body').click(function(){
    var scrollPost = $(document).scrollTop();
    alert(scrollPost);
});

我尝试过将scrollTop()附加到$('body')$('html'),当然还有$(window),但没有任何变化。
有什么想法吗?

dhxwm5r4

dhxwm5r41#

出于某种原因,删除“高度:100%“从我的html和body标签修复了这个问题。

ccrfmcuu

ccrfmcuu2#

我在滚动= 0时遇到了同样的问题:

document.body.scrollTop

下次使用

document.scrollingElement.scrollTop

编辑日期:2018年6月1日
如果你使用event,那么你得到的对象在targetsrcElement中有document元素。

这里是一个表格,显示了不同浏览器上的滚动操作。

正如你所看到的,Firefox和IE没有srcElement,IE 11也不支持scrollingElement

mhd8tkvw

mhd8tkvw3#

我的解决方案,在尝试了上面的一些,其中不涉及改变任何CSS:

var scroll_top = Math.max( $("html").scrollTop(), $("body").scrollTop() )

这适用于最新版本的Chrome、Firefox、IE和Edge。

v1uwarro

v1uwarro4#

我只是为那些可能犯同样错误的人准备了一个插件。我的代码如下:

var p = $('html,body');
$( ".info" ).text( "scrollTop:" + p.scrollTop() );

此代码将在除webkit浏览器(如chrome和safari)之外的所有浏览器上运行,因为<html>标记的scrollTop值始终为零或null。
其他浏览器会忽略它,而webkit的浏览器不会。
最简单的解决方案是从代码中删除html标记,瞧:

var p = $('body');
$( ".info" ).text( "scrollTop:" + p.scrollTop() );
jdgnovmf

jdgnovmf5#

从html和body标记中删除height: 100%;可以解决此问题。
原因是你可能已经把html和body元素的height属性值设置为100%,如果你把html和body元素的height属性设置为100%,它们的height就等于文档的height。

ffvjumwh

ffvjumwh6#

我也有同样的问题。scrollTop()适用于一些块,而不是文档或正文。要使这个方法工作,你应该为你的块添加高度和溢出样式:

#scrollParag {
    height: 500px;
    overflow-y: auto;
}

然后:

var scrolParag = document.getElementById('scrollParag');
 alert(scrolParag.scrollTop); // works!
ig9co6j1

ig9co6j17#

ScrollTop对我来说也总是返回0。我用它来聚焦页面上的特定元素。我用了另一种方法来做到这一点。
文档。获取元素按ID(“元素ID”)。滚动进入视图();
在移动的、平板电脑和台式机上都很适合我。

eufgjt7s

eufgjt7s8#

var bodyScrollTop = Math.max(document.scrollingElement.scrollTop, document.documentElement.scrollTop)

应该可以在现代浏览器上运行。

wgxvkvu9

wgxvkvu99#

对了,看来你应该用

$("body").scrollTop()

代替

$(".some-class").scrollTop

这就是我被困住的原因。

相关问题