调整大小事件未在div上触发 [英] resize event not triggered on div

问题描述

请看以下示例: https://jsfiddle.net/vxun2Lgg/2/

我附上了调整大小" container div上的事件侦听器.打开开发工具并修改容器的宽度后，不会调用resize回调.我想念什么?

I've attached an "resize" event listener on container div. After opening up dev tools, and modifying the width of container, resize callback does not get called. What am I missing?

PS:我对窗口调整大小事件不感兴趣，仅对 container div.

PS: I am not interested in window resize event, only in container div.

var container = document.getElementsByClassName("container")[0];
container.addEventListener("resize", function() {
  console.log("resizing")
});

<div class="container"></div>

推荐答案

resize 仅对 window 有效.如果受支持，则可以使用

resize is only valid for the window. If supported you can use ResizeObserver.

new ResizeObserver(() => console.log("resizing")).observe(container);

否则，您可能必须使用 setInterval 进行轮询并检查大小.

Otherwise, you will probably have to poll using setInterval and check the size.

这篇关于调整大小事件未在div上触发的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！