js 加alert后才能执行方法

Posted 2020-09-03 未来--

原因是：访问页面时，某些js方法还没初始化（或者还没有加载出来）此时调用肯定不执行。alert起到了延迟的功能，当用户点击确定此时要执行的js恰好初始化完成，能正常执行。

解决方法是 加setTimeout函数，延迟1秒执行js。

 

分析现象，逐个排查，找到问题的本质，想解决方案。

 

现象：在做手机端页面开发使，有一个倒计时功能，正常使用没问题。问题就出在当用户从手机浏览器切换到其他应用在切到手机浏览器，这这段时间内倒计时器没有执行，导致计数不准。

　　　　后来找到visibitilychange 事件，即页面可见性。当用户重新切换到浏览器时刷新页面从服务器拿到最新的倒计时时间。

测试后发现新的问题来了，ios 可以完美刷新。android 总是有时候刷新有时候不刷新。开始以为是visibilitychange浏览器兼容性问题，找了好久没解决。

反复debug发现，visitilitychange 每次都能执行并alert 值出来。接着排查 将问题 js刷新 当前页面。window.location.href=location.href。更换刷新代码后问题依然存在。

百思不得其解，这个时候转机出现了（念念不忘，终有回响），加入alert后每次都能正常刷新，去掉alert后就不刷新了。

这才找到问题发生的本质。

解决方法是：加setTimeout，1秒后执行刷新的操作

// 手机标签切换事件
function visibilityChange() {
	document.addEventListener(‘visibilitychange‘, function() { 
		var u = navigator.userAgent;
		if (u.indexOf(‘Android‘) > -1 || u.indexOf(‘Linux‘) > -1) {  
			//alert(document.visibilityState);
			if(document.visibilityState==‘visible‘){
				setTimeout(function() {
					location.reload();
				}, 1000);
			}  
		} else if (u.indexOf(‘iPhone‘) > -1) { 
			location.reload();
		}  else {
			setTimeout(function() {
				location.reload();
			}, 1000);
		} 
		 
	});
}