0

我使用 jQuery UI 嵌套了可调整大小。

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

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

我想破坏外部可调整大小，但不是内部。不幸的是，只是这样做......

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

...也打破了内部可调整大小。目前我可以让它工作的唯一方法是首先销毁孩子，然后销毁父母，然后重新初始化孩子。

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

虽然这在一个简化的例子中是可以的，但在实践中它是一个令人头疼的问题，因为我的可调整大小的 init 很复杂，而且不容易在运行中重做。

有谁知道任何其他解决方法/补丁可以让我破坏外部可调整大小并保持内部可调整大小而不必破坏和重新创建内部？

在此先感谢您的帮助。

4

2 回答 2

1

我的方法是扩展可调整大小的小部件，并覆盖其 _destroy 方法。将原始的 _destroy 方法复制到您的扩展小部件并替换

find(".ui-resizable-handle")

和

children(".ui-resizable-handle")

整个代码如下：

$.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;
    }
} );

比使用您的扩展小部件而不是原始的可调整大小。

$("#outer").customResizable();
$("#inner").customResizable();
$("#outer").customResizable("destroy");
于 2013-12-18T08:24:14.640 回答
0

你可以试试这个：

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

使用 .clone(true)应该保持可调整大小的功能。

于 2013-01-04T19:45:19.567 回答