微信内置浏览器打开网页有时JS无法执行问题解决方案

飘逸的风6年前 (2020-04-23)前端6268


苹果IOS微信内置浏览器打开网页,有时不会执行JS脚本,android安卓手机微信浏览器偶尔也有这样的问题,经过多次调试,发现是微信浏览器缓存了渲染页面,没有重新渲染页面,导致window.onload中JS无法执行。

经过以上分析判断,给出的解决方案就是,如果使用了缓存,自动重载页面。以下是JS代码解决方案:

window.onpageshow = function(event) {
	if (event.persisted) {
		window.location.reload();
	}
};

或者下方代码:

var isPageHide = false;
window.addEventListener('pageshow', function () {
	if (isPageHide) {
		window.location.reload();
	}
});
window.addEventListener('pagehide', function () {
	isPageHide = true;
});

html头部处理缓存信息:

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
扩展说明:

pageshow:

当一条会话历史记录被执行的时候将会触发页面显示(pageshow)事件。(这包括了后退/前进按钮操作,同时也会在onload 事件触发后初始化页面时触发)

详见:https://developer.mozilla.org/zh-CN/docs/Web/Events/pageshow


相关文章

实现jQuery扩展总结

开发自己需要的jQuery插件,看个示例说明 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://...

jQuery插件 图片放大镜-Cloud Zoom

jQuery插件 图片放大镜-Cloud Zoom

图片放大镜效果是一种不错的效果,多应用于电子商务、图片展示等网站,给用户带来更好的体验。实现这种效果的代码不少,今天要给大家介绍的是 Cloud Zoom,它是 jQuery 的一个插件。和其他产品相...

jQuery scrollUp - jQuery滚动到顶部插件

jQuery scrollUp - jQuery滚动到顶部插件

当网页内容过长,你浏览到底部需要回到顶部时,是不是希望“一键直达”呢?scrollUp 就是这样一款插件,它能够让用户滚动条滚动到一定的位置时(可设置),右下角出现“滚动到顶部”的按钮,点击后,页面就...

html+css 中 em和px 的尺寸解释

px像素(Pixel),相对长度单位。像素px是相对于显示器屏幕分辨率而言的。 em是相对长度单位,相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置,则相对于浏览器的默...

js控制在网页中禁用右键和禁止另存为的代码

禁止网页右击,选择,最简单的两句代码: <script type="text/javascript"> <!-- document.oncontextmenu=n...

jw player的快捷调用方法(附:jw player参数设定)

最近开发的项目需要调用一部分视频,找了很久,感觉有两个非常不错,一个是ckplayer(非常炫酷,网址:https://www.ckplayer.com/),感觉好奇的同学,可以访问他们的官网去看看;...

发表评论

访客

看不清,换一张

◎欢迎参与讨论,请在这里发表您的看法和观点。