zoukankan      html  css  js  c++  java
  • 监听微信端,手机端,ios端的浏览器返回事件,pc端关闭事件

    直接上代码了,可以监听微信端,手机端,iOS端的浏览器返回事件,关闭事件不支持

    当进入该页面,我们就给这个history压入一个本地的连接。当点击返回、后退及上一页的操作时,就进行监听,在监听代码中实现自己操作

    window.addEventListener("popstate", function(e) {  
            alert("我监听到了浏览器的返回按钮事件啦");//根据自己的需求实现自己的功能  
        }, false); 

    虽然我们监听到了后退事件,但是页面还是会返回上一个页面,所以我们需要使用pushState增加一个本页的url,代表本页,大家都非常清楚是#

    function pushHistory() {  
            var state = {  
                title: "title",  
                url: "#"  
            };  
            window.history.pushState(state, "title", "#");  
        }  

    当进入该页面,我们就给这个history压入一个本地的连接。当点击返回、后退及上一页的操作时,就进行监听,在监听代码中实现自己操作。

    下面是完整的代码:

    $(function(){  
        pushHistory();  
        window.addEventListener("popstate", function(e) {  
            alert("我监听到了浏览器的返回按钮事件啦");//根据自己的需求实现自己的功能  
    }, false);  
        function pushHistory() {  
            var state = {  
                title: "title",  
                url: "#"  
            };  
            window.history.pushState(state, "title", "#");  
        }  
          
    });

    1.在微信中进入页面就触发了popstate事件。

    解决方法:定义boolean 变量bool=false。在页面加载后,采用setTimeout方法设置1.5s的超时,在超时执行方法中设置bool=true。

    在popstate监听当中增加对bool的判断,当bool=true时,执行内容。具体代码如下:

    $(function(){  
                pushHistory();  
                var bool=false;  
                setTimeout(function(){  
                      bool=true;  
                },1500);  
                window.addEventListener("popstate", function(e) {  
                  if(bool)  
                    {  
                            alert("我监听到了浏览器的返回按钮事件啦");//根据自己的需求实现自己的功能  
                    }  
                    pushHistory();  
                      
            }, false);  
            });  
  • 相关阅读:
    石子合并问题(直线版)
    Python_07-常用函数
    Python_06-函数与模块
    C++中的头文件和源文件
    sell 项目 商品表 设计 及 创建
    SpringBoot集成Mybatis
    SpringBoot集成jdbcTemplate/JPA
    SpringBoot使用JSP渲染页面
    SpringBoot引入freemaker前端模板
    使用SpringBoot创建Web项目
  • 原文地址:https://www.cnblogs.com/qq735675958/p/7427141.html
Copyright © 2011-2022 走看看