当窗口调整大小时获取div的实时宽度？

Question

比方说，我有一个部分，它的宽度是1181（在控制台输出）和我使用下面的代码，找出它的宽度：

jQuery(document).ready(function() 
{ 
    var body_size = jQuery('section').width(); 
    console.log(body_size); 
}); 

如果我重新大小我的浏览器，我必须重新加载页面才能找到这个div的新大小。

有没有办法在我重新调整浏览器大小时找出大小？

Answer 1

您可以处理“调整大小”事件。需要警告的是，事件经常被触发非常，所以最好不要在处理程序中执行任何DOM操作，或尽可能少。处理这个问题的方法之一是使用计时器：

var resizeTimer; 
$(window).resize(function() { 
    clearTimeout(resizeTimer); 
    resizeTimer = setTimeout(function() { 
    var body_size = $('section').width(); 
    // ... 
    // do your work here 
    // ... 
    }, 200); 
}); 

，设置了一个定时器，这样你实际上并不会做任何工作，直到至少200毫秒用户停止调整大小后（或会暂停位）。