phonegap监听backbutton点击事件后,其他页面点击回退键出现无反应现象
2015-03-16 17:24
183 查看
phonegap版本:4.2.0
问题描述:
比如我们有三个页面,分别是main.html,page1.html,page2.html。我们有这样的需求:当在main.html页面点击回退键时要退出程序(默认是返回上一页),在page1.html或者page2.html上点回退键依然是返回上一页。自然而然,我们想到的是在main.html页面加上回退键监听事件,捕捉到后退出程序。于是我在main.html页面加上了下面的代码
在main.html页面测试,点击两次返回键退出程序,没问题。
但是,但是。。。我从main.html点击链接跳到page1.html或者page2.html后,再点击回退键竟然回不去了,也就是点击回退键在除了main.html这个页面以外都没反应了!
后来看了下phonegap的代码,发现是这样:
第一次绑定backbutton的监听函数后,cordova.js就会通知app,backbutton事件被重写了,所以不管载入什么页面app默认的backbutton事件都不会触发了,要通过cordova.js告诉app解除backbutton重写。
解决办法:
查了很多资料发现没有很好的解决办法,最后我的解决方法就是在每个页面都载入cordova.js,然后在cordova.js的初始化方法里先解除backbutton事件的重写,这样在没有监听backbutton事件的页面,点击回退键依然会触发默认事件(返回上一页)
大家如果有更好的方法,也欢迎探讨。个人邮箱towardsyoung@sina.com
问题描述:
比如我们有三个页面,分别是main.html,page1.html,page2.html。我们有这样的需求:当在main.html页面点击回退键时要退出程序(默认是返回上一页),在page1.html或者page2.html上点回退键依然是返回上一页。自然而然,我们想到的是在main.html页面加上回退键监听事件,捕捉到后退出程序。于是我在main.html页面加上了下面的代码
document.addEventListener("backbutton", onBackKeyDown, false); var shouldExit = false; function onBackKeyDown() { if (shouldExit) { navigator.app.exitApp(); } else { shouldExit = true; window.plugins.toast.showShortBottom('再点击一次退出程序!', function(){}, function(){}); setInterval(function(){ shouldExit = false; }, 3000); } }
在main.html页面测试,点击两次返回键退出程序,没问题。
但是,但是。。。我从main.html点击链接跳到page1.html或者page2.html后,再点击回退键竟然回不去了,也就是点击回退键在除了main.html这个页面以外都没反应了!
后来看了下phonegap的代码,发现是这样:
第一次绑定backbutton的监听函数后,cordova.js就会通知app,backbutton事件被重写了,所以不管载入什么页面app默认的backbutton事件都不会触发了,要通过cordova.js告诉app解除backbutton重写。
解决办法:
查了很多资料发现没有很好的解决办法,最后我的解决方法就是在每个页面都载入cordova.js,然后在cordova.js的初始化方法里先解除backbutton事件的重写,这样在没有监听backbutton事件的页面,点击回退键依然会触发默认事件(返回上一页)
大家如果有更好的方法,也欢迎探讨。个人邮箱towardsyoung@sina.com
相关文章推荐
- 使用微信内置浏览器点击下拉框出现页面乱跳转现象(iphone),该怎么办
- Fragment出现点击穿透事件,其他fragment中的控件点击被响应了
- 关于ubuntu16.4 中安装最新的eclipse或者是STS出现页面特卡,且新建项目没有提示,preference选项中点击左侧标签右侧没反应的解决办法,参照google, 排版不太好,希望对一些小伙伴有所帮助
- 退出后点击浏览器后退不能回到成功页面;直接进入页面和跳转进入页面样式不同;防止直接输入页面地址或servlet;当servlet跳servlet时,进行其他操作后后退出现错误!
- IDE intellij报错(点击File—setting页面无反应并且出现IDE error occored)
- Fragment出现点击穿透事件,其他fragment中的控件点击被响应了
- android用webview加载H5页面出现点击事件失效的问题解决
- 为什么Button点击了没反应,反而其他事件反应了
- 微信内置浏览器中,点击下拉框出现页面乱跳转现象(iphone)
- 弹出页面(window.showModalDialog(...)/iframe)中的导出Excel事件 点击没反应的问题
- 在页面中监听用户控件的按钮点击事件
- ASP.NET后台代码方式识别页面“按钮点击”和浏览器F5“刷新”事件
- 点击table列表中的行button,将行信息带入后台或者其他页面
- jsp 页面点击事件后弹出DIV层代码
- VS2005 TreeView 的 CheckBox 被点击时的引发页面回发事件
- magento 后台分类页面catelog,点击后,出现右边信息不同步显示,不显示点击的分类的信息,问题的解决!!!
- ASP.NET后台代码方式识别页面“按钮点击”和浏览器F5“刷新”事件
- phpcms大栏目页面导航出现不换行现象
- 防止点击后退的时候,出现网页过期的现象