完美解决,手机浏览器端,点击返回后事件无效
2017-08-18 本文已影响79人
高少辉_骚辉
我们都知道,在浏览器端,使用 window.onunload 或者 window.onbeforeunload 无效。所以在手机端,总是做不了关闭确认这个事情。
这边我使用了,window.history 特性,来实现需求
先看代码
function onBeforeUnload () {
window.history.pushState( null, null, window.location.search )
window.onpopstate = () => {
if( xxx ) {
// 自定义你的弹窗,如果用户再次点击按钮则会直接返回上一个页面了
return
}
// 如果不需要进行,弹窗,或者其它判断则直接返回上一个页面
window.history.back()
}
}
onBeforeUnload()
代码中,我使用进入页面的时候,我们会使用 window.history api pushState 进行 插入一条本页面的历史记录,然后利用用户点击返回的时候,如果你的历史记录时使用 pushState 插入的,则会调用 window.onpopstate 这个事件,我们就可以在里面进行我们的操作啦,弹窗也好,都可以