4

これは、jQuery Resizable Exampleから派生した私の完全なコードです-

私の例では、要素が要素内にあるdividparentとの 2 つの要素があります。私の問題は、要素をサイズ変更しても、要素のサイズを変更できないことです。誰かが同様の問題に直面しましたか?childchildparentparentresizable

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>jQuery UI Resizable - Default functionality</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>

  <style>
  #parent {
    padding: 40px;
    width:400px;
    height:400px;
  }

  #child { 
    width: 150px;
    height: 150px;
  }

  </style>
  <script>
  $(function() {    
    $( "#child" ).resizable();
    $( "#parent" ).resizable();
  });
  </script>
</head>
<body>

<div id="parent" class="ui-widget-content">
  <h3>Parent</h3>
    <div id="child" class="ui-widget-content">
        <h3>Child</h3>
    </div>
  </div>
</body>
</html>

ノート

コードをいじってみると、この問題が発生するのは、child要素の前にparent要素をサイズ変更可能にする場合だけであることがわかりました。コードのように -

  $(function() {    
    $( "#child" ).resizable();
    $( "#parent" ).resizable();
  });

順序を次のように変更すると -

  $(function() {    
    $( "#parent" ).resizable();
    $( "#child" ).resizable();
  });

スムーズに動作します。なぜそれが起こっているのかわかりません。

jQueryのサイズ変更可能なコードを調べてみますが、誰かがすでにこの問題に直面して解決している場合は非常に役立ちます.

-ありがとう

4

1 に答える 1

1

これに関するチケットはjQuery バグトラッカー (チケット #7711)で開かれていますが、ご覧のとおり、「バグではない」と見なされ、自分で見つけた回避策を解決策として指定しています。

回避策として、サイズ変更可能な外側/親を最初に初期化すると、両方ともサイズ変更可能になります

于 2014-03-19T11:29:15.353 に答える