jquery - 如何销毁 jquery 可调整大小而不破坏子可调整大小？

Question

我有一个可调整大小的父 div(仅宽度) - 在这个 div 中，我有许多其他 div 也可调整大小(仅高度)。

有时我想禁用或销毁父级宽度调整大小，但保留内部高度调整大小。

当我调用 $("#idTopDiv").ressized("destroy"); 时，这也会破坏所有子 div 上的可调整大小。

典型布局是:-

<div id=idDivTop> <!-- Resizable width -->
    <div id=idInnerOne>
    </div>

    <div id=idInnerTwo> <!-- Resizable height -->
    <div>
</div>

感谢任何想法。

Answer 1

我认为发生这种情况是因为可调整大小的销毁会删除 ui 元素内部的所有调整大小句柄，其中恰好包括内部可调整大小的调整大小句柄。所以内部的可调整大小实际上并没有被破坏，它们只是变得困惑了。

可以查看Ressized源码here ;它发生在第 199 行，其中显示 .find('.ui-ressized-handle').remove();。

要解决此问题，您还需要对内部可调整大小调用 destroy 方法，然后重新创建它们。 (jsfiddle)

$("div").resizable();

// Destroy all three resizables
$("div").resizable("destroy");

// Recreate the inner resizables
$("#idInnerOne, #idInnerTwo").resizable();

您需要这样做来删除在创建时设置的可调整大小的绑定(bind)和数据，否则当您尝试重新创建它时它会认为它已经创建并且什么也不做。

您也可以考虑禁用外部可调整大小而不是销毁它，但是 has its own issues .