javascript - 如何停止在 Jquery 中克隆属性或标记

Question

我在 Jquery 中遇到问题。我想克隆一个从一个 div1 拖到另一个 div2 的属性或标签，这很好。 但问题是当我拖动或移动 div2 上现有标签的位置时，克隆是星标

我只想从div1拖到div2时克隆，请告诉我哪里错了，哪里错了。

这是我的 div1

<div class="md-card scroll-style">
                    <div class="draggable-items">
                        <img class="img_style" src="tools_icon/ic_text_format.svg" data-toggle="tooltip" title="Text Input" data-placement="bottom">
                        <div id="text_field_clone" class="draggable_items_hide">
                            <input type="text" name="text_field">
                        </div>
                    </div>
                </div>

这是div2

<div class="droppable_box_style scroll-style" id="droppable-box">

                </div>

这个 Jquery 代码

<script type="text/javascript">
        $(document).ready(function () {

            $(".draggable-items").draggable({
                grid: [ 20, 20 ],
                appendTo: '#droppable-box',
                containment: "window",
                cursor: 'move',
                revertDuration: 100,
                revert: 'invalid',
                helper: 'clone'
            });

            $("#droppable-box").droppable({
                accept: ".draggable-items",
                drop: function (event, ui){

                    ui.helper.clone().appendTo('#droppable-box');

                    $("#droppable-box > .draggable-items").find(".img_style").hide();

                    $("#droppable-box > .draggable-items").find("#text_field_clone").removeClass("draggable_items_hide").addClass("show").resizable();

                    $("#droppable-box > .draggable-items").draggable();
                }
            });
            // $('[data-toggle="tooltip"]').tooltip();
        });   
    </script>

我的布局是这样的

Answer 1

将克隆函数附加到 Jquery mouseup 事件:

 $(selector).mouseup(function(){
    //put cloning code here
    });

Refer Demo Here