jquery - ドロップ、クローン、ドラッグ可能、新しいdivにドラッグした後もクローンを継続

Question

これは、要素のクローンを作成してドラッグアンドドロップする最初の試みです。このサイトに掲載されている記事を読んだり、例やその他のトラブルの問題を調べたりすることで、ここまで到達しました。しかし、私が理解できなかったのは、画像のクローン作成です。画像を新しいdivにドロップすると、クローンが作成され、引き続き移動可能です。しかし、クローンを移動した後も、新しいイメージのクローンを作成し続け、既存のイメージを新しいDivに残します。私は何もしないために同様の問題を抱えている多くの投稿を検索して試しました。クローンを作成した後も、既存のDivに関連付けられていると思いますか？

これが私のコードです：

<script>
    var copy = 0;
    $(function () {
        $("#iWidget").accordion();
        $("#iWidget img").draggable({
            cursor: 'move',
            revert: 'invalid',
            appendTo: "body",
            helper: "clone"
        });
        $("#iBoard img").draggable();
        $("#iBoard").droppable({
            drop: function (event, ui) {
                copy++
                var TemEle = $(ui.helper).clone().attr("id", $(this).attr('id') + copy);
                $(this).append(TemEle)
                TemEle.draggable();
                alert('drop id:' + TemEle.attr('id'));
            }
        });
    });


<div class="iPage">
<div id="iBoard">
</div>

<div id="iWidget">
    <h1>Network</h1>
    <div>
        <asp:Image ImageUrl="Images/Network/WRouterONLINE.gif" ID="WRouterONLINE" runat="server"  Height="30px" Width="30px" />
        <asp:Image ImageUrl="Images/Network/ModemONLINE.gif" ID="ModemONLINE" runat="server"  Height="30px" Width="30px" />
    </div>
    <h1>Servers</h1>
    <div>
        <asp:Image ImageUrl="Images/Server/ServerONLINE.gif" ID="ServerONLINE" runat="server"  Height="30px" Width="30px" />
    </div>
    <h1>Workstations</h1>
    <div>
        <asp:Image ImageUrl="Images/Workstations/AlienwareONLINE.gif" ID="AlienwareONLINE" runat="server"  Height="30px" Width="20px" />
        <asp:Image ImageUrl="Images/Workstations/PCONLINE.gif" ID="PCONLINE" runat="server"  Height="30px" Width="30px" />
    </div>
    <h1>Other</h1>
    <div>
        <asp:Image ImageUrl="Images/Other/PS3ONLINE.gif" ID="PS3ONLINE" runat="server"  Height="30px" Width="30px" />
        <asp:Image ImageUrl="Images/Other/BlueRayONLINE.gif" ID="BlueRayONLINE" runat="server"  Height="30px" Width="30px" />
        <asp:Image ImageUrl="Images/Other/TabletONLINE.gif" ID="TabletONLINE" runat="server"  Height="30px" Width="30px" />
    </div>
</div>

ありがとう！