检测何时使用JavaScript调整窗口大小？
jQuery或JavaScript有没有办法在用户结束调整浏览器窗口大小时触发函数？
换句话说：
- 当用户调整浏览器窗口大小时，我是否可以检测到鼠标释放事件？否则：
- 是否可以检测窗口大小调整操作何时完成？
我目前只能在用户开始使用jQuery调整窗口大小时触发事件
回答 4
Stack Overflow用户
发布于 2010-06-08 18:21:35
您可以使用.resize()来获取每次宽度/高度实际更改的时间，如下所示：
$(window).resize(function() {
//resize just happened, pixels changed
});You can view a working demo here，它将获取新的高度/宽度值，并在页面中更新它们以供您查看。记住，事件并不是真的开始或结束，它只是在调整大小时“发生”……没有什么可以说下一次不会发生。
Edit: By comments似乎你想要一个类似于"on- end“事件的东西，你找到的解决方案可以做到这一点，但有几个例外(你不能在跨浏览器的方式中区分鼠标释放和暂停，结束和暂停也是如此)。不过，您可以创建该事件，使其更简洁，如下所示：
$(window).resize(function() {
if(this.resizeTO) clearTimeout(this.resizeTO);
this.resizeTO = setTimeout(function() {
$(this).trigger('resizeEnd');
}, 500);
});你可以在某个地方有一个基本文件，无论你想要do...then什么，你都可以绑定到你正在触发的新resizeEnd事件，如下所示：
$(window).bind('resizeEnd', function() {
//do something, window hasn't changed size in 500ms
});Stack Overflow用户
发布于 2019-08-09 14:40:42
只使用JavaScript的另一种方法是：
window.addEventListener('resize', functionName);每次大小改变时都会触发，就像另一个答案一样。
functionName是调整窗口大小时执行的函数的名称(末尾的括号不是必需的)。
Stack Overflow用户
发布于 2019-04-07 12:41:45
这可以通过JavaScript中GlobalEventHandlers接口的onresize属性来实现，方法是将一个函数分配给onresize属性，如下所示：
window.onresize = functionRef;
下面的代码片段演示了这一点，它通过控制台在调整窗口大小时记录窗口的innerWidth和innerHeight。(调整窗口大小后会触发resize事件)
function resize() {
console.log("height: ", window.innerHeight, "px");
console.log("width: ", window.innerWidth, "px");
}
window.onresize = resize;<p>In order for this code snippet to work as intended, you will need to either shrink your browser window down to the size of this code snippet, or fullscreen this code snippet and resize from there.</p>
https://stackoverflow.com/questions/2996431
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号