微信浏览器返回刷新，监听微信浏览器返回事件，网页防复制

Posted 一只迷路精灵

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了微信浏览器返回刷新，监听微信浏览器返回事件，网页防复制相关的知识，希望对你有一定的参考价值。

以下代码都经过iphone7，华为MT7 ，谷歌浏览器，微信开发者工具，PC端微信验证。如有bug，还请在评论区留言。 

demo链接：https://pan.baidu.com/s/1c35mbjM 密码：5yyf

1.移动端微信浏览器返回刷新事件，在返回后的页面上加上以下代码：

<script type="text/javascript">
        $(function () { 
          var isPageHide = false; 
          window.addEventListener(‘pageshow‘, function () { 
            if (isPageHide) { 
              window.location.reload(); 
            } 
          }); 
          window.addEventListener(‘pagehide‘, function () { 
            isPageHide = true; 
          }); 
        })

    </script>

2.监听微信浏览器返回事件，在需要返回监听的页面上插入以下代码：

<script type="text/javascript">
        $(function() {
            pushHistory();
            window.addEventListener("popstate", function(e) {
                alert("我监听到了浏览器的返回按钮事件啦"); //根据自己的需求实现自己的功能  
                pushHistory(); //去掉这行，监听只能执行一次
            }, false);
            function pushHistory(){
                var state = {
                    title: "title",
                    url: "#"
                };
                window.history.pushState(state, "title", "#");
            }
        });
    </script>

3.网页防复制：

（1）移动端：body标签上面加  ontouchstart="return false"

<body  ontouchstart="return false">
复制不了~
</body>

（2）PC端：页面上插入以下JS

<script language="JavaScript">
    document.oncontextmenu=new Function("event.returnValue=false;");
    document.onselectstart=new Function("event.returnValue=false;");
    </script>

 

以上是关于微信浏览器返回刷新，监听微信浏览器返回事件，网页防复制的主要内容，如果未能解决你的问题，请参考以下文章

微信web页面返回刷新

js监听微信浏览器返回按钮事件

钉钉和微信，监听自带的返回功能事件，刷新页面

监听当点击微信等app的返回按钮或者浏览器的上一页或后退按钮的事件

微信浏览器左上角返回按钮的监听

vue监听页面宽度高度