jQuery 移动设备 - 在 Window 加载后跳转到顶部

Question

我们 jQuery 移动 m.swisswebcams.ch。当我在页面仍在加载时向下滚动时，它似乎总是在页面加载时再次跳起来（即 window.onload）。

如何解决这个问题？

重现此问题的步骤：

在移动浏览器中打开 m.swisswebcams.ch
在页面仍在加载时立即向下滚动
等到页面自己跳到顶部
（并非总是如此。因此您有时可能需要重试。）

结果

打开网站：

向下滚动：

自动跳到顶部（不需要）：

Answer 1

如评论中所述：此行为是设计使然。有两种请求 URL 的方式：一种方式是 "full" 或 "normal" 或 "non-javascript" 请求，例如输入 URL，单击 link 或提交表单，另一种方式是后台 ajax 请求，其中 javascript 将响应填充到 html 容器中。第一种方式总是在页面加载时跳转到页面顶部（恕我直言，在所有浏览器中，除非您通过 F5 刷新已加载的页面）。

更新

作为网站程序员，您需要解决此浏览器行为。只需使用 jQuery loader or jQuery Mobile events 在页面加载时显示一些状态栏或旋转的圆圈。

Answer 2

好吧，此行为在 jQuery 移动版中是默认的（实际 v. 1.4.5）。来自 jQuery 移动源代码：

    // 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 起不再有效，但它是 "full-screen mode" 中最需要的功能之一（请参阅 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 Changelog

Fixed page load to Prevent silentScroll if user has already scrolled (#3958, 0996492)

jQuery 移动设备 - 在 Window 加载后跳转到顶部

jQuery Mobile - Jumps To Top After Window Load

jquery

jquery-mobile

重现此问题的步骤：

结果