Jquery 在移动端如何让返回能够不刷新页面?

[hoythan]

https://segmentfault.com/q/1010000007863491?_ea=1476187

在移动端,我有一个按钮,点击后会弹出一个 div 层, 用户选择好内容后可以点击确定关闭这个 div, 这个步骤因为在同一个页面是没有跳转的.

但是因为担心的误触返回导致按钮这个界面东西都白填了就不好了

想问下能不能实现弹出的 div 层的时候 点击返回按钮能够控制仅仅关闭 div 层不回跳?

有人提到了 onbeforeunload,onunload,onpagehide ,但是不会用?

[jarlyyn]

https://developer.mozilla.org/en-US/docs/Web/API/History

控制 history

[onlyhot]

弹出表单后隐藏返回按键不就好了？
别人都提供思路了，你说不会用也是厉害，翻手册去

[onlyhot]

另外，弹出表单，你给返回按键重新定义触发函数也行啊

[hoythan]

@onlyhot 如果我能控制手机的返回按钮我还费个什么劲啊

[hoythan]

@onlyhot 绑定浏览器返回按钮的触发函数是什么?

[hoythan]

@onlyhot 如何隐藏浏览器的返回按钮?

[hoythan]

@onlyhot 控制浏览器的按钮的手册在哪里?

[BOYPT]

使用 router, 用户点击功能时候跳转的是#hashtag ，这样返回按钮是在用户的记录中跳转（而不会跳转页面）。
有些 router 也兼容楼上说的 history api 。

[ragnaroks]

页面关闭时先执行 onbeforeunload,后 onunload,重写 onbeforeunload 方法(最常见的就是你关闭当前页面,会提示你是否确定离开),不过可能有的手机浏览器并不支持.

[hoythan]

@BOYPT 非常感谢,原来锚链接可以记录跳转,这样就好办了.

[Biwood]

非常简单，弹出 div 层的时候给当前页面的 url 赋值一个 hash ，同时绑定 onhashchange 事件，点返回的时候，页面不会刷新，只是 hash 变化了，同时可以在 hashchange 事件绑定的函数里面关闭 div 弹窗

[BOYPT]

@Biwood 这就是 router 实现的，我但是觉得自己实现要很繁琐； 我以前项目用过 director https://github.com/flatiron/director
都两年没更新了，没支持 history api 。

@hoythan
比较新的库比如 https://github.com/tildeio/router.js/ 就支持 history api 。
最明显的例子是 github 的源码浏览窗口, 点击源码目录， url 栏目随即变化，但是页面不刷新，把 url 复制出去重新打开，也能回到这个目录；

[learnshare]

pushState ，看起来又要推荐 Vue/React/Ng 了

[GeoffZhu]

最简单的办法，不应该是弹窗上放一个明显的 X ，让用户点这个关。如果不能放，控制 history 是最好的方法

[maijiawei]

history.go(-1)