【原创】js实现页面重定向,增强移动端跳转体验(可自定上一页地址)

作者Veris 文章分类 分类:Javascript 文章评论 0条评论 阅读次数 已被围观 940

单页面应用可忽略

我们知道js有个方法可以使用window.location.href="xxx.."进行页面跳转,做移动前端的小伙伴肯定知道,这个方法虽然简单,但是也有很多问题:

示例情景:

某移动web项目需要实现在【列表页】点击【发布帖子】按钮进入【帖子发布页】,编辑完内容后按发帖按钮,这里有两种请求方法

1、直接post表单提交(页面会跳转到处理发布的页面)

2、ajax提交(会起一个xhr请求到处理发布的后端接口)

不管是表单提交还是ajax提交,发布成功后总会跳回到【列表页】,这是一个正常的流程

实现以上步骤后,问题随之而来,我们知道页面跳转是会有历史记录的,一般在手机中按返回键或右滑(一些应用的返回操作)可以返回到上一个页面,这里的问题是:我们处在的位置【列表页】的上一页是【发布页】

这种体验极差,试想用户发完文章跳转到列表页后,点返回又回到了【发布页】,肯定不爽。

按正常的APP流程逻辑,在【列表页】中按返回应该跳回类似【首页】的位置。

小V直接贴代码:

history.pushState(null, null, '返回页地址');
location.href = '新页面地址';

这里应用了HTML5的属性history.pushState,有兴趣的朋友可以自行百度。


=================================================

转载请注明出处:

作者:Veris

最族 [ http://www.mostclan.com ]


发表评论: