Android Phonegap与jQuery移动-后退按钮的结果滚动到页面的顶部

Android Phonegap with jQuery Mobile - back button results in scroll to top of page

本文关键字:滚动 结果 顶部 按钮 Phonegap jQuery 移动 Android      更新时间:2023-09-26

我的手机应用程序在iOS上的表现与预期一样,但在android下,在点击新页面链接之前滚动的任何溢出div都会在返回时滚动回顶部。页面似乎没有被重新加载,只是在过渡完成之前滚动到顶部。

我似乎正在经历这里讨论的问题。所有建议的解决方法都没有帮助。

我使用Phonegap 2.0.0和jQuery Mobile 1.2.0

谁有解决办法?

Android的返回键在PhoneGap上很混乱。我所做的只是禁用了Android的后退键。

$(function(){
    document.addEventListener("deviceready", onDeviceReady, false);
})
// PhoneGap is loaded and it is now safe to call PhoneGap methods
//
function onDeviceReady() {
    // Register the event listener
    document.addEventListener("backbutton", onBackKeyDown, false);
}
// Handle the back button
//
function onBackKeyDown() {
    console.log("Back button pressed but nothing happened");
}

这是我选择的方法。如果你想使用后退按钮,那么这个解决方案不适合你。

禁用后退按钮对我来说不是一个可行的解决方案,并且由于history.back()在jQM框架中用于后退导航,因此无论如何都存在相同的结果。即使使用Phonegap的navigator.history.back()也会产生不良影响。最后,我添加了这样的处理程序,当然可以改进(欢迎建议):

/* ANDROID WORKAROUND */
$('div').on('pagebeforehide', function(event, ui) {
    var scrollPos = $(this).find('.scrolldiv').scrollTop();
    $(this).jqmData('scrollPos',scrollPos );
});
$('div').on('pagebeforeshow', function(event, ui) {        
    var page = $(this);
    setTimeout(function(){
        //using animate becuse I could not get scrollTo() to work (?)
        $(page).find('.scrolldiv').animate({scrollTop: $(page).jqmData('scrollPos')}, 0);
    },1); //add it to the JS process stack
});