使用js拖放克隆图片，从原图拖动复制到指定的div里面，原图依然保持不动

Question

问题描述

因为用jquery的helper : 'clone'克隆的导致调试的时候看到其他的div,是从jquery.js里来的，然后就导致我另一个在这个元素上的功能实现不了

问题出现的环境背景及自己尝试过哪些方法

尝试过用选择器去获取，发现我的格式都是div包括的

var img = document.getElementsByClassName("div.nav-imgs img");去获取img，获取不到，我也不知道是不是我自己写错了

相关代码

// 请把代码文本粘贴到下方（请勿用图片代替代码）
$(document).ready(function(){

    $(function () {
        $(".nav-imgs").draggable({
            revert : 'invalid',//如果设置为 "invalid"，还原仅在 draggable 未放置在 droppable 上时发生
            opacity : 0.7,//不透明度
            helper : 'clone',//如果设置为 "clone"，元素将被克隆，且克隆将被拖拽
            scope : 'drop'//一个“default”与droppable带有相同的scope值的draggable会被该droppable接受
        });
        $(".div-rows-col").droppable({//拖动复制到指定的div当中
            scope : 'drop',
            drop : function(event, ui) {
                var ud = ui.draggable;
                if (ud.draggable("option", "helper") == "clone") {
                    ud.clone().appendTo($(".div-rows-col")).css({
                        position : 'absolute',
                        left : ui.offset.left,
                        top : ui.offset.top
                    }).draggable({
                        scope : 'drop',
                        revert : 'invalid'
                    }).resizable();//调整大小resizable
                }
            },
            
            out : function(event, ui) {
                ui.draggable.remove();
            }
        });

    });

    $(function() {
        $(".ui-widget-conten").resizable();
    });
});

部分html代码
<div class="nav-is">

                <div class="nav-imgs">
                    <img class="cdft n-imgs" src="image/p1.png" width="194px"
                        height="145.5px" />
                </div>
                <div class="nav-names">
                    <a>数据指挥</a>
                </div>

你期待的结果是什么？实际看到的错误信息又是什么？

但我运行时出现这样，导致我另一个在这个元素上的功能实现不了