场景
window.onresize或者$(window).resize()触发两次.比如浏览器全屏显示,如果使用screen.availHeight重布局屏幕会闪两次,因为resize方法会进2次.而且每次screen.availHeight都不一样.
原因
和浏览器的自身实现有关系.不同的浏览器和操作系统实现可能不一样,具体自己可以去玩一下.
参考: stackoverflow
错误实现
代码
window.onresize = function() {
console.info(screen.availHeight);
};
结果
全屏按钮点击时:
解决办法
为resize设置一个延迟
window.onresize = function() {
var res;
if (res){clearTimeout(res)}
res = setTimeout(function(){console.log("resize triggered");},20);
};