嵌套Resizables - 如何銷燬的父母不是孩子？

我有嵌套resizables使用jQuery UI。嵌套Resizables - 如何銷燬的父母不是孩子？

<div id="outer"> 
    <div id="inner"></div> 
</div> 

$("#outer").resizable(); 
$("#inner").resizable();

我想摧毀外部可調整大小，但不是內部。不幸地只是這樣做...

$("#outer").resizable("destroy");

...也打破了內部可調整大小。目前我能得到這個工作的唯一途徑是首先摧毀了孩子，然後破壞了父母，然後重新初始化的孩子。

$("#inner").resizable("destroy"); 
$("outer").resizable("destroy"); 
$("#inner").resizable();

雖然這是一個簡單的例子好了，在實踐中很頭疼，因爲我的可調整大小的init是複雜的，不容易重做的飛行。

有誰知道任何其他解決方法/補丁，讓我破壞外調整大小，保持內可調整大小，而不必也破壞並重新創建內的？

感謝（提前）對你的幫助。

來源

2013-01-04 user1031947

你可以試試這個：

var inner_clone = $('#inner').clone(true); 
$('#outer').resizable('destroy'); 
$('#inner').replaceWith(inner_clone);

使用.clone（真）應保持可調整大小的功能。

來源

2013-01-04 19:45:19 Derek

謝謝，我已經嘗試過。不幸的是，它不起作用 - 我的內部元素對它們有很多綁定，這種克隆似乎也打破了。 – user1031947

我的方法是延長可調整大小的窗口小部件，並覆蓋其_destroy方法。

$.widget("ui.customResizable", $.ui.resizable, { 
    _destroy: function() { 

     this._mouseDestroy(); 

     var wrapper, 
      _destroy = function(exp) { 
       $(exp).removeClass("ui-resizable ui-resizable-disabled ui-resizable-resizing") 
        //The only place you need to change is replace find with children. 
        .removeData("resizable").removeData("ui-resizable").unbind(".resizable").children(".ui-resizable-handle").remove(); 
      }; 

     //TODO: Unwrap at same DOM position 
     if (this.elementIsWrapper) { 
      _destroy(this.element); 
      wrapper = this.element; 
      this.originalElement.css({ 
       position: wrapper.css("position"), 
       width: wrapper.outerWidth(), 
       height: wrapper.outerHeight(), 
       top: wrapper.css("top"), 
       left: wrapper.css("left") 
      }).insertAfter(wrapper); 
      wrapper.remove(); 
     } 

     this.originalElement.css("resize", this.originalResizeStyle); 
     _destroy(this.originalElement); 

     return this; 
    } 
});

不是用你的擴展插件，而不是原來的：複製原_destroy方法您的擴展插件並更換

find(".ui-resizable-handle")

與

children(".ui-resizable-handle")

完整的代碼如下調整大小。

$("#outer").customResizable(); 
$("#inner").customResizable(); 
$("#outer").customResizable("destroy");

來源

2013-12-18 08:24:14 merlin

嵌套Resizables - 如何銷燬的父母不是孩子？

回答

相關問題