jQuery Mobile - 窗口加载后跳转到顶部

Question

我们使用jQuery mobile for m.swisswebcams.ch.当我在页面仍然加载时向下滚动时,它似乎总是在页面加载时跳起来(即window.onload).

怎么解决这个问题？

---

重现此问题的步骤:

1. 在移动浏览器中打开m.swisswebcams.ch
2. 在页面仍在加载时立即向下滚动
3. 等到页面自动跳到顶部
4. (它并不总是发生.所以你有时可能需要再试一次.)

---

结果

开放网站:

向下滚动:

自动跳转到顶部(不需要的):

Answer 1

好吧，这种行为在 jQuery Mobile 中是默认的（实际 v. 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 删除了“minimal-ui”视口属性，还有其他“软全屏”解决方案吗？还对最新版本的 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 变更日志

修复了页面加载以防止用户已经滚动时的silentScroll (#3958, 0996492)