0

jQuery UI Resizable次のようにdomに追加されたら、要素を動的に与えようとしています:

      insert.click(function(e) {
        var selectedImage = $(this).parent().find('.gallery-item.active');
        var htmlImage = selectedImage.find('img');


        var selectedDiv = $('.zone.selected .drag-image');
        //selectedDiv.clone().append(htmlImage);

        var insertedImage = htmlImage.clone();
        var resized = insertedImage.resizable();
        console.log(selectedDiv);
        console.log(resized);
        resized.appendTo(selectedDiv);

      });

    });

activeこれが何をするかというと、クリックされてクラスが与えられた画像を見つけます。insert-image(href ボタン) がクリックされると、画像をコピーして DOM に追加します。

これはうまくいきます。問題は、画像にresizeable.

上記のコードを実行するimgと、DOM に次の HTML が挿入されます。

サイズ変更可能な矢印の画像を表示する UI コードが含まれていないようです。

<div class="ui-resizable-handle ui-resizable-e" style=""></div>
<div class="ui-resizable-handle ui-resizable-s" style=""></div>
<div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se ui-icon-grip-diagonal-se" style="z-index: 1001;"></div>

要素のサイズを変更できるようにするすべてのコードを追加する方法はありますか?

4

1 に答える 1