在窗口调整大小时获取 div 的实时宽度？答案

【问题标题】：Get live width of div as window resizes?在窗口调整大小时获取 div 的实时宽度？
【发布时间】：2013-01-06 06:07:37
【问题描述】：

假设我有一个部分，它的宽度是 1181（在控制台中输出），我正在使用以下代码来找出它的宽度：

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

如果我重新调整浏览器的大小，我必须重新加载页面以找出这个 div 的新大小。

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

【问题讨论】：

查看 resize 活动 - api.jquery.com/resize
$(window).resize(fn)..

标签： jquery html resize window width

【解决方案1】：

您可以处理“调整大小”事件。请注意，该事件非常经常触发，因此最好不要在处理程序中进行任何 DOM 操作，或者尽可能少地进行操作。处理此问题的一种方法是使用计时器：

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

这会设置一个计时器，以便在用户停止调整大小（或暂停片刻）后至少 200 毫秒，您实际上不会做任何工作。

【讨论】：

一个快速的问题。我将如何删除以前的尺寸并只显示新尺寸？
@KeithDonegan 这取决于您如何“显示”尺寸。您是否正在更新页面上的某些元素？如果您的意思是在控制台中，则不能；没有控制台 API 可以返回并更改已记录的内容。
感谢您的回复。我只想在另一个 div 中显示它。类似：“Div is: 672px”等
又完美了，我用的是前置！非常感谢您的帮助 Pointy。