手机返回事件监听

标签: 手机返回事件监听
9人阅读 评论(0) 收藏 举报
分类:

文案参考https://www.zhihu.com/question/40511430

其中遇到了苹果端无法给绑定元素添加事件的小坑,解决办法

//给事件元素添加
cursor:pointer;
//防止点击元素出现闪烁背景
-webkit-tap-highlight-color:transparent;


$(function(){ 
        pushHistory(); 

        window.addEventListener("popstate", function(e) { 
            alert("我监听到了浏览器的返回按钮事件啦");//根据自己的需求实现自己的功能
            // closeWindow()
            $('body').append('<div id="window-close" style="width:100vw;height:100vh;background:rgba(0,0,0,.5);position:absolute;top:0;left:0;z-index="9999999;"><div style="background:#fff;cursor:pointer;" class="sure" style="width:50vw;margin:0 auto;">确定</div><div class="cancel" style="width:50vw;margin:0 auto;cursor:pointer;-webkit-tap-highlight-color:transparent;">取消</div></div>')

        }, false); 
        $('body').on('click','#window-close .sure',function(){
            closeWindow()
        })
        $('body').on('click','#window-close .cancel',function(){
            $(this).parents('#window-close').remove();
            return false;
        })
        function closeWindow(){
            var ua = navigator.userAgent.toLowerCase(); 
            if(ua.match(/MicroMessenger/i)=="micromessenger") { 

                WeixinJSBridge.call('closeWindow'); //微信
            } else if(ua.indexOf("alipay")!=-1){ 
                AlipayJSBridge.call('closeWebview'); //支付宝
            }else if(ua.indexOf("baidu")!=-1){ 
                BLightApp.closeWindow(); //百度
            }else{ 
                window.close(); //普通浏览器
            }  
        }
        function pushHistory() { 
            var state = { 
                title: "title", 
                url: "#"
            }; 
            window.history.pushState(state, "title", "#"); 
        }
    });

ok ,快去实现下吧

查看评论

监听手机浏览器的返回按钮事件

//监听到了浏览器的返回按钮事件 pushHistory(); window.addEventListener("popstate", function(e) { //alert("我监听到了...
  • qupeng666
  • qupeng666
  • 2017-07-04 11:14:14
  • 413

mobile device touch events

  • 2015年01月14日 20:23
  • 1.81MB
  • 下载

Spring MVC学习及案例

1、Spring Web MVC是什么 Spring Web MVC是一种基于Java的实现了Web MVC设计模式的请求驱动类型的轻量级Web框架,即使用了MVC架构模式的思想,将web层进行...
  • lizhonglinhouse
  • lizhonglinhouse
  • 2015-05-05 09:49:21
  • 378

输入框事件监听(二):中文输入与229

继续之前的例子,我们在文本框中输入“中文”两个汉字,并且每个汉字都确认一次,最后事件监听的输出结果如下图所示。 从这张图中我们发现如下问题: 1. 在中文输入法下,keydown监听到的键值都是2...
  • yiifaa
  • yiifaa
  • 2016-08-31 11:04:43
  • 1130

浏览器返回事件监听

在进入当前页面的时候向历史站压入该页面, 当监听到返回事件就是popstate的时候, 进行对应的操作, 我们修改历史站的操作pushState不会触发popstate事件, 可见MDN.   ...
  • xiaoWebNo
  • xiaoWebNo
  • 2017-11-02 17:02:27
  • 95

如何监听安卓机返回键和苹果机微信的返回键事件

应用场景:开发众筹系统的时候,点击捐款按钮弹出金额选择及输入的部分,最新的需求是按微信(ios)返回键和安卓机的返回键,若点开了捐款的选择金额部分,不能返回到上一页,只能隐藏该模块。 延伸:图片插件...
  • qiangqin3990
  • qiangqin3990
  • 2017-08-17 17:23:22
  • 1241

andorid中基于回调事件传播返回true与false的区别

明天 接着写。
  • shouniezhe
  • shouniezhe
  • 2014-09-18 23:26:45
  • 674

phonegap Device获取设备信息

  • 2014年03月13日 16:25
  • 2.4MB
  • 下载

JSLEE-SIPServlet

  • 2010年05月10日 11:52
  • 345KB
  • 下载

mui 安卓返回事件

plus.key.addEventListener('backbutton', function() { if (confirm('确认退出?')) { plus.runtime.quit();...
  • moniteryao
  • moniteryao
  • 2015-04-14 23:02:13
  • 2493
    个人资料
    持之以恒
    等级:
    访问量: 11万+
    积分: 3263
    排名: 1万+
    淘宝精品推荐