CSS3 resize 属性可以分配给任意元素。我正在寻找一种方法来检测这样的调整大小，比如说，div（我不介意它目前只在 Firefox 中工作）：
div {
resize: horizontal;
overflow: hidden;
}
不幸的是，该onresize事件似乎并未在 div 上触发。当发生这种用户实例化的调整大小时，我如何在 JavaScript 中检测到？
编辑： FWIW 我在 Mozilla 上打开了一个错误报告。如果你想跟踪它：https : //bugzilla.mozilla.org/show_bug.cgi?id=701648
调整大小就像改变风格。因此，它可以通过MutationObserver观察到。更具体ResizeObserver的可能更好：
let observer = new ResizeObserver(function(mutations) {
console.log('mutations:', mutations);
});
let child = document.querySelector('textarea');
observer.observe(child, { attributes: true });<textarea></textarea>收听DOMAttrModified事件。从这个答案中得到了想法，这个 jsFiddle似乎在 Firefox 8 中工作（如果你打开控制台）。
由于该resize事件显然不起作用（至少目前是这样），您可以尝试以下替代选项之一：
mousedown,mousemove和/或的组合mouseup来判断div/ 是否已调整大小。如果您想要真正细粒度的控制，您可以在每个mousemove事件中检查div 的大小/是否调整了大小。如果你不需要，你可以简单地使用请勿mousemove在所有的，只是测量div的mousedown和mouseup图，如果它是在后者调整了。setTimeout()。您可以使用ResizeSensor来自 css-element-queries polyfill 的类
https://github.com/marcj/css-element-queries
它允许您针对所有类型的元素（不仅是window. 它设置了一个真正的传感器，而不是一个 javascriptsetTimeout轮询。
像这样使用它：
new ResizeSensor($('#myelement'), function() {
console.log("myelement's size has changed");
});
支持的浏览器是：all incl。IE6+。
这对我来说似乎很有效：
$("body").on('mousedown mousemove', ".resizeItem", function () {
console.log($(this).height());
})
“使用mousedown、mousemove 和/或mouseup 的组合”
根据 Felixs 的回答。
在将自定义搜索结果面板与 Dev Extremes Scroll View 结合使用时特别有用，并且您希望对其进行完全控制。
$("body").on('mousedown mousemove', ".scrollContainer", function () {
var h = $(this).height() - 20;
$(".scrollArea").dxScrollView('instance').option('height', h);
});