js 监听返回键利用pushState

我的开发工作主要是做移动端广告的页面，为了留住更多的用户，我们需要监听浏览器的返回键，在用户返回时，弹出弹窗来进一步提供选项来分流客户。（监听关闭键无法自定义弹窗）

使用的方法就是利用pushState（基于jq，改成原生不难，自己动手。。。。）。

先上代码

if (window.history && window.history.pushState) {//监听浏览器前进或后退$(window).on('popstate', function () {$('.outModals').hide() //outModals  弹窗class$('.outModals').remove()//当浏览器前进时不弹弹窗if(location.hash.indexOf('myback')==-1){stateInit()}});  //防止浏览器刷新造成多个历史记录if(location.hash.indexOf('myback')==-1||location.hash==''){window.history.pushState(number, null, '#myback'); window.history.forward(1);}
}else {//统计下因为兼容问题所存在的用户addTongJi()
}

function stateInit(){var html='弹窗的dom class=outModals '$('body').append(html)// 继续$('.outModals_sure').unbind('click').bind('click',function () {addTongJi('continue')$('.outModals').hide()$('.outModals').remove()window.history.forward(1);})//离开$('.outModals_out').unbind('click').bind('click',function () {addTongJi('break')$('.outModals').hide()$('.outModals').remove()window.history.go(-1)})}

pushState 添加一条 history 实体作为替代原来的 history 实体

$(window).on('popstate', function () {}）监听history 实体变化。

js 监听返回键利用pushState相关推荐

在Android中实现监听返回键，主键，菜单键
一.监听返回键 onKeyDown方法和onBackPressed方法 onKeyDown: 是当某个按键被按下是触发.所以也有人在点击返回键的时候去执行该方法来做判断.(该方法只是android ...
Android监听返回键、Home键+再按一次返回键退出应用
Android监听返回键需重写onKeyDown()方法 Home键keyCode==KeyEvent.KEYCODE_HOME [java] view plaincopy @Override pub ...
Android下监听返回键、home键、任务键
1.监听返回键 @Overridepublic boolean onKeyDown(int keyCode, KeyEvent event) {if (keyCode == KeyEvent.KEYC ...
Android 如何监听返回键，弹出一个退出对话框
Android 如何监听返回键点击事件,并创建一个退出对话框, 防止自己写的应用程序不小心点击退出键而直接退出.自己记录下这个简单的demo,备用. 注:如下代码当时是从网上copy过来的,现在忘了它 ...
android设置返回按钮无效,Android onKeyDown监听返回键无效的解决办法
Android onKeyDown监听返回键无效的解决办法当我们的Activity继承了TabActivity,在该类中重写onKeyDown是监听不到返回键的, 具体解决方法如下: 重写dispa ...
Vue 点浏览器后退模态框有灰色遮罩，监听返回键 this 无效
问题:前端使用 <el-dialog 实现模态框当打开模态框后,点击浏览器上的后退按钮,发现遮罩还在. 解决办法监听返回键,遇到的问题是直接用 this.xxx 无效,原因是此处 this 非 ...
android全局监听onkeydown,Android中的几个onTouch()事件、onKeyDown监听返回键无效
Android中的几个onTouch()事件.onKeyDown监听返回键无效一:Android中的几个onTouch()事件继承SimpleOnGestureListener,HahaGestu ...
php 微信监听返回键,JavaScript_JS监听微信、支付宝等移动app及浏览器的返回、后退、上一页按钮的事件方法，在实际的应用中，我们常常需 - phpStudy...
JS监听微信.支付宝等移动app及浏览器的返回.后退.上一页按钮的事件方法在实际的应用中,我们常常需要实现在移动app和浏览器中点击返回.后退.上一页等按钮实现自己的关闭页面.调整到指定页面或执行一 ...
Android监听返回键、Menu键、Home键、
back键监听back键还是很简单的,有两种方法: 调用onBackPressed()方法:调用此方法会自动调用finish(). @Override public void onBackPress ...

js 监听返回键利用pushState

js 监听返回键利用pushState相关推荐

最新文章

热门文章

js 监听返回键 利用pushState

js 监听返回键 利用pushState相关推荐

最新文章

热门文章

js 监听返回键利用pushState

js 监听返回键利用pushState相关推荐