3

私はフォームデザイナーを作成しており、ボタン、テキストボックスなどの画像を含むツールボックスを持っています。ユーザーはこれらの各コントロールをフォームにドラッグするので、 jQuery を使用していDraggable()ます。フォームのどこかにドロップした後、このコントロール (または画像) はツールボックスの元の場所に戻り、ユーザーがフォームにコントロールをドロップした位置に実際のコントロールを挿入する必要があります。

これは私がしたことです：

<div id="tools">
    <div id="draggables">
        <img class="tool" alt="Button" id="button" src="Data/Button.png" />
        <img class="tool" alt="TextBox" id="textBox" src="Data/TextBox.png" />
        <img class="tool" alt="RadioButton" id="radioButton" src="Data/RadioButton.png" />
        <img class="tool" alt="CheckBox" id="checkBox" src="Data/CheckBox.png" />
    </div>
    <img alt="Trash" id="trash" src="Data/trash.png" />
</div>

それから：

$(function () {
    $("#draggables").children().draggable();
});

問題は、指定されたコントロールをフォーム内の選択された位置にdraggable()挿入するには、最後 (または他の場所) に何を追加する必要があるかということです。

より良い解決策があれば幸いです。

4

1 に答える 1

1

JQuery UIのdroppableをベースにShoping Cartを実現した例があります。

これはあなたのタスクと同様の動作をします。カートにコピーした後のアイテムはその場所に戻ります。

ただし、複数のフォーム要素をコピーするときに、一意のフォーム要素名を追加するという問題を解決する必要があります。

于 2012-06-13T23:45:50.760 に答える