Jquery Mobile返回按钮滚动到顶部
在我的Jquery Mobile网站上，我使用href作为后退按钮;
但如果我在第一页上滚动，后退按钮会再次跳回到顶部。 第一页不会保持相同的位置。
这有什么解决方案吗？
解
我有这个问题我使用iSroll修复它
从PageA转到PageB时，将PageA的滚动位置保存在变量中。
这样做修改iscroll.js并在scrollTo下添加getScrollY方法
scrollTo : function(x, y, time, relative) { var that = this, step = x, i, l; that.stop(); if (!step.length) step = [{ x : x, y : y, time : time, relative : relative }]; for ( i = 0, l = step.length; i < l; i++) { if (step[i].relative) { step[i].x = that.x - step[i].x; step[i].y = that.y - step[i].y; } that.steps.push({ x : step[i].x, y : step[i].y, time : step[i].time || 0 }); } that._startAni(); }, getScrollY : function() { var that = this; return that.y; },
现在在页面更改之前保存当前位置
curScrollPos = myScroll.getScrollY();
并且在返回到PageA时设置滚动位置，我在PageB的pagehide事件上执行此操作
myScroll.scrollTo(0, curScrollPos, 1); myScroll.refresh();
这样我解决了我的问题，希望这有帮助。
更多信息
如果您想了解有关此主题的更多信息，请查看本文 ，您还可以找到有用的示例。
在我描述您需要了解的可用解决方案之前，这不是错误，也不是一个完美的解决方案。 问题是，为了设置转换到另一个页面的动画，视口必须位于页面的顶部，以便当前页面和转换的页面垂直排列。
如果你在一个页面上的长列表中间（比如1000px）并且你要传输的页面只有几百个像素高，那么当前页面将在屏幕上正常显示动画，但新页面将不会显示为它会在视口上方。
有两种可行的解决方案：
iScroll及其jQuery Mobile派生iScrollview
iScroll主页： http ：//cubiq.org/iscroll-4
iScrollview主页： https ： //github.com/watusi/jquery-mobile-iscrollview
iScroll是一个javascript，可以在Web浏览器的窗口中滚动内容，其行为与iPhone和Android等移动设备上的原生滚动非常相似。 这意味着您可以使用类似本机的滚动条和物理滚动浏览器中的窗口。
这也是我们当前问题的解决方案。 由于iScroll实现页面将占据页面高度的100％，无论列表视图滚动多远。 这也是为什么返回列表视图仍然会保持在同一位置的原因。
当然，如果您想要实现此解决方案，您应该选择iScrollview实现。 你仍然可以实现iScroll，但它会花费你更多的时间。
无声的滚动
官方文档： http ： //jquerymobile.com/demos/1.1.0-rc.1/docs/api/methods.html
这个jQuery Mobilefunction也是我们首先遇到这个问题的原因。 在触发页面转换之前，原始页面将以静默方式滚动到顶部。
在我们的例子中，当选择listview时，必须记住它的位置（在这里你会发现在页面转换期间存储数据/参数的解决方案，只是在页面改变之前搜索章节：页面转换之间的数据/参数操作）。 在这种情况下，当我们返回上一页时，我们可以使用pagebefpreshow事件在显示页面之前静默滚动到底部。
//scroll to Y 100px $.mobile.silentScroll(100);
这是一个静音滚动的工作示例： http ： //jsfiddle.net/Gajotres/2xfrM/
这是一个真实的生活jsFiddle示例使用大型listview和几个页面： http ： //jsfiddle.net/Gajotres/5zZzz/
// Detect click on a li element and store its coordinate, change page to another $(document).on('pagebeforeshow', '#index', function(){ $('#test-list li').on('click', function(){ storePosition.topCoordinate = $(this).offset().top; $.mobile.changePage('#second'); }); }); // If there's a stored position use silentscroll function and scroll to correct location $(document).on('pageshow', '#index', function(){ if(storePosition.topCoordinate !== null) { $.mobile.silentScroll(storePosition.topCoordinate); } }); // Store position location var storePosition = { topCoordinate : null }
不幸的是，在您的示例中，此解决方案仅适用于pageshow。 由于jQM架构，只能在pageshow事件期间执行此操作。
最后的笔记
如果您想了解有关iScroll + iScrollView的更多信息，以及它们如何使用工作示例，请查看本文 。
我在这里找到了一个解决方案： https ： //forum.jquery.com/topic/jquery-mobile-scroll-to-top-of-page-on-page-load#14737000005271291
(function($){ $( document ).on( "mobileinit", function() { var silentScroll = $.mobile.silentScroll; $.mobile.silentScroll = function( ypos ) { if ( $.type( ypos ) !== "number" ) { // FIX : prevent auto scroll to top after page load return; } else { silentScroll.apply(this, arguments); } } }) }(jQuery));