重现此问题的步骤：

Question

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

如何解决这个问题？

重现此问题的步骤：

在移动浏览器中打开m.swisswebcams.ch
在页面仍在加载时立即向下滚动
等到页面自动跳到顶部
（并不总是如此。所以有时你可能需要再试一次。）

结果

开放网站：

向下滚动：

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

Answer 1

嗯，这种行为默认情况下是jQuery Mobile（实际v.1.4.5 ）。来自jQuery Mobile源代码：

Compares two files or sets of files and displays the differences between them


FC [/A] [/C] [/L] [/LBn] [/N] [/OFF[LINE]] [/T] [/U] [/W] [/nnnn]
   [drive1:][path1]filename1 [drive2:][path2]filename2
FC /B [drive1:][path1]filename1 [drive2:][path2]filename2

/A         Displays only first and last lines for each set of differences.
/B         Performs a binary comparison.
/C         Disregards the case of letters.
/L         Compares files as ASCII text.
/LBn       Sets the maximum consecutive mismatches to the specified
           number of lines.
/N         Displays the line numbers on an ASCII comparison.
/OFF[LINE] Do not skip files with offline attribute set.
/T         Does not expand tabs to spaces.
/U         Compare files as UNICODE text files.
/W         Compresses white space (tabs and spaces) for comparison.
/nnnn      Specifies the number of consecutive lines that must match
           after a mismatch.
[drive1:][path1]filename1
           Specifies the first file or set of files to compare.
[drive2:][path2]filename2
           Specifies the second file or set of files to compare.

这是前面评论中引用的silentScroll函数：

    // 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 );
    }

这种解决方法从iOS 7开始不再有效，但却是“全屏模式”中最受欢迎的功能之一（请参阅有关SO的大量问题）。

这实际上是参考：iOS 8 removed "minimal-ui" viewport property, are there other "soft fullscreen" solutions?，其中也详细解释了iOS的更新版本。

猜测，也许你没有注意到这种行为，因为你有更新的iOS版本，或者你不需要全屏，因为你已经手动滚动。

您可以通过覆盖JQM设置来阻止初始滚动顶部：

....
    // 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 );
    },
...

尝试一下，让我知道这是否解决了您的问题。在我的测试中，它有效。

修改这个恼人的行为已在即将发布的JQM 1.5版本中得到修复：

参考：jQuery Mobile 1.5.0-alpha1 Changelog

如果用户已经滚动，则修复页面加载以防止silentScroll （＃3958,0996492）

Answer 2

如评论中所述：此行为是设计原因。请求URL有两种方式：一种方式是＆＃34;完整＆＃34;或＆＃34;正常＆＃34;或＆＃34;非javascript＆＃34;请求输入URL，单击链接或提交表单，另一种方式是后台ajax请求，其中javascript填充html容器中的响应。第一种方式始终在加载时跳转到页面顶部（在所有浏览器中都是恕我直言，例如，当你用F5刷新已经加载的页面时）。

更新

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

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

重现此问题的步骤：

结果

2 个答案: