2012-05-05 5 views
9

私はサイズ変更可能な親divを持っています(幅のみ) - このdiv内には、サイズ変更可能な他のdivもいくつかあります(高さのみ)。jQueryサイズ変更可能なファイルを破壊せずに破壊するにはどうすればよいですか?

時々、親の幅のサイズ変更を無効にするか破棄したいが、内側の高さを変更する必要があります。

私は$("#idTopDiv").resizable("destroy");を呼び出すと、すべての子divのサイズ変更可能ファイルも破棄されます。

典型的なレイアウトは次のとおりです。 -

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

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

は、任意のアイデアを感謝しています。

+0

子divで '.resizable'をもう一度呼び出そうとしましたか? –

答えて

6

私はこれが起こると思うのですが、resizableの破壊はui要素内のすべてのサイズ変更ハンドリングを削除します。これには、内部のresizablesのサイズ変更ハンドルが含まれています。だから、内部のresizablesは実際に破壊されていない、彼らはちょうど台無しになっている。

サイズ変更可能なソースコードhereが表示されます。それは.find('.ui-resizable-handle').remove();と書かれています。

これを修正するには、内側のresizablesのdestroyメソッドも呼び出してから再作成する必要があります。 (jsfiddle

$("div").resizable(); 

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

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

あなたはそれ以外の場合は、あなたがそれを再作成しようとすると、その既に作成さだと思いますし、それは何もしないだろう、バインディングおよびデータ作成時にサイズ変更可能なセットアップそれを取り除くためにそれを行う必要があります。

また、サイズ変更を外すのではなく、サイズ変更を無効にすることも考えられますが、その場合はhas its own issuesです。

+2

Justinに感謝します。おそらく、.findは.children( ".ui-resizable-handle")でなければなりません。 – Nigel

関連する問題