在开发混合项目的过程有个需求是h5自定义页面的回退功能,等到无法回退的时候,直接关闭h5网页直接返回app界面。查找了很多资料都说无法实现,要不就是检测history.length来判断,但是我实际操作发现,回退的时候history.length并不会自动减少。最后自己分析了下回退的模式,使用sessionStorage实现的。大致如下:
我从app跳转到a页面,在从a页面跳转到b页面,然后b点击回退a,在从a点击回退,这时候直接关闭a页面,回退到app。分析得到
1、当我跳转浏览不同页面的时候就会记录一个浏览历史地址
2、当我在从当前b页面点击回退的a页面的时候,我从浏览历史地址中把这个记录移除掉,为了防止多次点击触发删除历史记录,我们需要做个处理,将当前页面地址和浏览的历史地址最后一个记录匹配,成功了才可以进行回退
演示效果如下:【备注:浏览器演示,回退到不能回退了,我直接关闭网页】
下面是源码:
(function(win){
var TabBarPlug=function(options){
this.barTitle='DEMOBAR';
}
TabBarPlug.prototy

在混合项目开发中,需要实现H5页面的自定义回退功能。当无法回退时,关闭H5并返回App。通过分析发现,history.length在回退时不减小,因此采用sessionStorage来实现这一需求。在从App跳转到A,再从A到B后,B回退到A,A回退则关闭页面,返回App。关键在于记录浏览历史,并在回退时删除当前页面的记录,避免重复触发。源码如下。
最低0.47元/天 解锁文章
435

被折叠的 条评论
为什么被折叠?



