Javascript jQuery UI可调整大小的消防窗口调整大小事件

我有两个事件，一个用于检测窗口大小，另一个用于检测div的可调整大小的停止

但是当我调整div的大小时，在控制台中检测窗口调整大小事件

有没有办法阻止这一切

$(document).ready(function(){
     $(window).bind('resize', function(){
        console.log("resize");    
     }); 
     $(".a").resizable();
 });

---

示例：

您看到这种行为是因为事件冒泡。一种解决方法：使用

event.target

检查回调中的事件源：

$(window).bind('resize', function(event) {
    if (!$(event.target).hasClass('ui-resizable')) {
        console.log("resize");
    }
});

演示：

---

---

另一个解决方案是向可调整大小的文件添加

resize

处理程序，并停止事件在DOM树上的传播（这就是“冒泡”）。（编辑：这应该行得通，但由于某种原因不行：）

我认为实际上最安全的做法是做以下几件事：

$(window).bind('resize', function(event) {
    if (this == event.target) {
        console.log("resize");
    }
});

---

对我来说，使用jQuery1.7.2，这里提出的任何解决方案都不起作用。所以我不得不想出一个稍微不同的版本，既适用于旧版IE浏览器，也适用于Chrome浏览器

$(window).bind('resize', function(event) {
    if ($(event.target).prop("tagName") == "DIV") {return;}  // tag causing event is a div (i.e not the window)
    console.log("resize");
});

---

如果调整大小的元素不是一个

的元素，则可能必须对其进行调整。所有这些答案都没有帮助。问题是调整事件大小会在窗口中出现气泡。因此，最终e.target将成为窗口，即使调整大小发生在div上。因此，真正的答案是停止传播调整大小事件：

$("#mydiv").resizable().on('resize', function (e) {
    e.stopPropagation(); 
});

---

谢谢！这是在升级到jQueryUI 1.6（从1.5）之后开始的，我不知道出了什么问题。现在，我正在过滤上述调整大小事件，它可以工作。@Matt Ball-event.target元素不是元素本身，而是调整大小处理程序（至少在版本1.8中是这样）。因此，最好将类名与ui可调整大小的句柄进行比较，或者将event.target与窗口元素本身进行比较。还可以检查target是否具有getAttribute方法，该方法仅适用于DOM元素对象，这样在IE8中这对我不起作用，其中

event.target

与

window

相同。一个适合我的解决方案是检查是否存在鼠标坐标：如果定义了

event.clientX

，则它是一个jQuery可调整大小的事件。如果未定义

event.clientX

，则为“真实”窗口大小调整。这是最好的方法（使用target甚至clientX进行黑客攻击只会导致问题）。这一定是一个bug。当某些元素的宽度和高度发生变化时，它应该与窗口大小调整无关。

$(window).resize(function(e) {
  if (e.target == window)
    /* do your stuff here */;
});