jQuery scrollTop()为所有元素返回0
在我的工作中,我们有一个用AngularJS创建的单页网站。
我们正在使用ui-router插件(版本0.2.0)。
最近我注意到当从一个状态移动到另一个状态时,窗口不会滚动到顶部。
我甚至试图在每次状态更改时使用jQuery的scrollTop()
函数手动滚动到顶部(使用$stateChangeSuccess
事件)。 但它没有用。
所以我开始调查,我注意到scrollTop()
为页面上的每个元素返回0。
不仅如此,当我将window.scrollY
打印到控制台时,我得到0(无论我在页面上的哪个位置)。 不仅在我的代码中,而且即使我只是在chrome dev工具控制台中编写它。
我用AngularJS和ui-router编写了几个应用程序,它只发生在这个特定的应用程序中。
我已经检查过是否覆盖了scrollTop()
函数甚至是window.scrollY
字段,但是没有找到任何东西。
我尝试使用ui-view
和autoscroll="true"
并使用autoscroll="false"
,但它并没有什么区别。
我也试过给html
和body
元素height:100%
,我也没试过。 但没什么。
我真的不知道接下来该做什么。
我无法重现这个问题,但如果您认为我应该在这里发布任何可以提供任何帮助的代码,我会很乐意这样做。
谢谢!
编辑:
我在控制台上运行此function:
var l = $('*').length; for(var i = 0; i 0) { console.log(elem, elem.scrollTop()); } }
该function只打印出一个带有顶部滚动的元素。
元素是一个包装div,它包含整个内容和主视图(我的应用程序中有嵌套视图)。
如果我在这个元素上使用scrollTop(0)
,我得到了我想要的东西,但它只处理症状,而不是真正的问题。
正如@Hans评论的那样,实际上并没有问题。 我有一个包装元素,它位于absolute
位置:
top:0; bottom:0; left:0; right:0; overflow:auto
所以窗口的scrollTop
始终为0,滚动条实际上属于包装元素。
由于我无法摆脱包装元素的定位,我使用了ui-router的$stateChangeSuccess
事件,并手动将包装元素滚动到顶部。
从控制台,尝试
console.log(frames) console.log(frames.top.scrollY)
如果window.scrollY显示为0,则参考帧不能是窗口。 你在页面上有任何iframe吗? console.log框架将显示页面上的框架列表。
希望有所帮助。
我的代码也发生了这个问题,我找到了一个正文{overflow:hidden;}是原因,我删除了“overflow:hidden;” 一切都很好。