jQuery UI可調整大小的防火窗口調整大小事件

Question

我有2個事件，一個用於檢測窗口調整大小，另一個用於檢測div的可調整大小的停止。

但是當我調整div的大小時，在控制台中檢測窗口調整大小事件。

有什么方法可以阻止這個嗎？

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

示例： http ： //jsfiddle.net/qwjDz/1/

Answer 1

所有這些答案都無濟於事。 問題是調整大小事件會向窗口冒泡。 所以最終e.target將成為窗口，即使調整大小發生在div上。 所以真正的答案是簡單地停止傳播resize事件：

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

Answer 2

由於事件冒泡，您會看到此行為。 一種解決方法：使用event.target檢查回調中的事件源：

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

演示： http ： //jsfiddle.net/mattball/HEfM9/

---

另一個解決方案是向resizable添加一個resize處理程序，並停止事件在DOM樹上的傳播（即“冒泡”）。 （ 編輯：這應該有效，但出於某種原因不行： http ： //jsfiddle.net/mattball/5DtdY 。）

Answer 3

我認為最安全的做法是：

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

Answer 4

對我來說，使用JQuery 1.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");
});

如果元素調整大小不是<div>則可能必須調整它

Answer 5

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

http://bugs.jqueryui.com/ticket/7514