Jquery 使用可拖动控件层拖放文本输入框

我的主要目标是能够拖放文本类型的输入框 为了找到一个解决方案，我扫描了一下网页，最后我想到了下面的一个方法——在输入框上放置一个div，它的不透明度非常高，这样就不会显示出来，而且z索引更大

但div的风格定位（绝对、相对、静态或继承）中没有一个不适合我

这是js生成的html代码：

这是我为我的多层想法添加的代码：

    $('#' + inputID).css('z-index', '5');
    var draggableCtrl = '<div style="height: ' + $('#' + wrapperId).height() + ';width:' + $('#' + wrapperId).width() + ';background-color: blue; position: static; z-index: 10; top :' + pos.top + '; left :' + pos.left + ';"></div>';
    $('#'+wrapperId).append(draggableCtrl);

$（'#'+inputID）.css（'z-index'，'5'）；
var draggableCtrl=''；
$（'#'+wrapperId）.append（draggableCtrl）；

有人知道我做错了什么吗

---

如果您已经到了这里，那么非常感谢您的尝试：）

当您无法再单击文本框时，您打算如何聚焦文本框并在其中键入内容，只需使用tab？我会建议这样做……我不想聚焦文本框，我收到了所需的文本，我只需要拖动它们，不，这对我不起作用-我的一个要求是不改变原来的页面布局（当我拖动一个文本框时，它会复制它-我已经用标签成功地做到了，显然这要容易得多），那么为什么你需要文本框呢？像这样，或者可能？因为我接收文本框作为输入-但这一个看起来更像我需要的-但是一个div的可拖动事件如何影响外部文本框？另外，我应该说，我收到了一个有很多编辑框和标签的页面，用户将能够拖放其中的每一个。。。