window.onload
)。
如何解决这个问题?
重现此问题的步骤:
- 在您的移动浏览器中打开m.swisswebcams.ch
- 在页面仍在加载时立即向下滚动
- 等到页面自动跳转到顶部
- (这不总是发生。所以有时您需要再试一次。)
结果
打开网站:
向下滚动:
自动跳转到顶部(不需要的):
window.onload
)。
如何解决这个问题?
打开网站:
向下滚动:
自动跳转到顶部(不需要的):
好的,这个行为在jQuery Mobile中是默认的(实际版本为1.4.5)。来自jQuery Mobile源代码:
// hide iOS browser chrome on load if hideUrlBar is true this is to try and do it as soon as possible
if ( $.mobile.hideUrlBar ) {
window.scrollTo( 0, 1 );
}
这是前面评论中提到的silentScroll函数:
....
// Scroll page vertically: scroll to 0 to hide iOS address bar, or pass a Y value
silentScroll: function( ypos ) {
if ( $.type( ypos ) !== "number" ) {
ypos = $.mobile.defaultHomeScroll;
}
// prevent scrollstart and scrollstop events
$.event.special.scrollstart.enabled = false;
setTimeout(function() {
window.scrollTo( 0, ypos );
$.mobile.document.trigger( "silentscroll", { x: 0, y: ypos });
}, 20 );
setTimeout(function() {
$.event.special.scrollstart.enabled = true;
}, 150 );
},
...
自iOS 7以来,此解决方法已不再有效,但它是“全屏模式”中最受欢迎的功能之一(在SO上有很多关于此的问题)。
实际上,这是参考链接:iOS 8 removed "minimal-ui" viewport property, are there other "soft fullscreen" solutions?,其中还有对更高版本iOS的详细说明。
只是猜测,也许您没有注意到这种行为,因为您拥有更新的iOS版本,或者您不需要全屏,因为您已经通过手动滚动实现了滚动。
您可以通过覆盖JQM设置来防止初始滚动到顶部:
<script type="text/javascript">
$(document).bind("mobileinit", function() {
$.mobile.ajaxEnabled = false;
$.mobile.hideUrlBar = false; // <---- add this line
});
var GLOBAL = {
language : 'de'
};
</script>
请尝试并告诉我是否解决了您的问题。在我的测试中,它有效。
编辑: 这种令人讨厌的行为已在即将推出的JQM 1.5版本中得到修复:
参考:jQuery Mobile 1.5.0-alpha1变更日志
修复页面加载,如果用户已经滚动,则防止静默滚动 (#3958, 0996492)
如评论中所述:这种行为是设计上的。请求URL有两种方式:一种是“完整”或“正常”或“非JavaScript”请求,例如输入URL、单击链接或提交表单;另一种是后台ajax请求,其中JavaScript将响应填充到HTML容器中。第一种方式在加载时总是跳转到页面顶部(在所有浏览器中IMHO,除非您通过F5刷新已加载的页面)。
更新
作为网站程序员,你可以绕过这个浏览器行为。只需使用jQuery loader或jQuery Mobile events来显示一些状态栏或旋转圆圈,同时页面正在加载。