看起来,当调整 HTML 元素的大小时,窗口的调整大小事件也会被触发。
由于我想在调整元素大小时和调整窗口大小时执行不同的逻辑,是否有一种非黑客的方法来处理这个问题?
$(function(){
$(window).on('resize', function(){
// This event gets fired when the #my_element div gets resized, event if
// window doesn't get resized itself
$('#text').text(++resizes);
});
$('#my_element').resizable();
});
换句话说,问题是当我调整一个元素的大小时,它的所有父元素的调整大小事件都会被触发,即使它们的大小没有改变
最佳答案
根据其他信息,我认为这反射(reflect)了窗口的行为。
$(function () {
var resizes = 0;
$(window).on('resize', function () {
$('#text').text(++resizes);
});
$('#my_element').resizable();
$("#my_element").on('resize', function (e) {
e.stopPropagation();
});
});
http://jsfiddle.net/djwave28/CPUwW/7/
编辑:替代和“更优雅”的解决方案
尽管上述解决方案工作完美,但我对必须在 resizing() 小部件之外进行管理感到不满意。但事实并非如此。深入挖掘后,可以在“创建”阶段停止传播。为了展示这个解决方案,我将其添加到上一个解决方案中。
$(function () {
var resizes = 0;
$(window).on('resize', function () {
$('#text').text(++resizes);
});
$('#my_element').resizable({
create: function (event, ui) {
$(this).parent().on('resize', function (e) {
e.stopPropagation();
});
}
});
});
更新了 fiddle : http://jsfiddle.net/djwave28/CPUwW/9/
关于jquery - 调整元素大小会触发窗口的调整大小事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15902920/