600字范文 > 微信浏览器返回刷新监听微信浏览器返回事件网页防复制移动端禁止图片长按和vivo

微信浏览器返回刷新监听微信浏览器返回事件网页防复制移动端禁止图片长按和vivo

时间：2023-02-26 04:24:13

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

demo链接：/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.监听微信浏览器返回事件，在需要返回监听的页面上插入以下代码：

$(function() {

pushHistory();

window.addEventListener("popstate", function(e) {

alert("我监听到了浏览器的返回按钮事件啦"); //根据自己的需求实现自己的功能

pushHistory(); //去掉这行，监听只能执行一次

}, false);

//停留在当前页面，阻止页面返回

function pushHistory(){

var state = {

title: "title",

url: "#"

};

window.history.pushState(state, "title", "#");

}

});

</script>

监听：按返回键退出微信浏览器

<script type="text/javascript">

$(function() {pushHistory();window.addEventListener("popstate", function(e) {WeixinJSBridge.call('closeWindow');pushHistory(); //去掉这行，监听只能执行一次}, false);function pushHistory() {var state = {title: "title",url: "#"};window.history.pushState(state, "title", "#");}});

</script>

3.网页防复制：

（1）移动端：body标签上面加ontouchstart="return false"（整个网页不能touch），或者用user-select：none；（文本不能复制）

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

.no-select{

-webkit-user-select:none;

-moz-user-select:none;

-o-user-select:none;

user-select:none;

}

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

img{pointer-events: none;/*禁用鼠标*/ }