jQuery UI:在拖动时未显示的克隆元素
jQuery UI:在拖动时未显示的克隆元素
提问于 2016-10-30 10:49:40
我已经创建了2个div，我希望将第一个div的克隆拖放到第二个div中。问题是，当我拖动克隆时，它就消失了，但是一旦它被放到第二个div中，它就会出现。
html代码：
<div id="green" class="editable"></div>
<div id="container"></div>jQuery代码：
$(document).ready(function(){
$(".editable").draggable({helper:'clone'});
$(".editable").resizable();
$("#container").droppable({
drop: function(event,ui){
$(this).append($(ui.draggable).clone());
}
});
});此外，我在标题部分包括以下内容：
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>提前谢谢。
回答 2
Stack Overflow用户
回答已采纳
发布于 2016-10-30 10:59:22
所有样式都设置在原始元素的ID上。
克隆元素时，不应用样式。这就是你认为它消失的原因。实际上，它只是得到默认的背景色，这是透明的。
请注意，我将您的id="green"更改为class="green"
$(document).ready(function(){
$(".editable").draggable({helper:'clone'});
$(".editable").resizable();
$("#container").droppable({
drop: function(event,ui){
$(this).append($(ui.draggable).clone());
}
});
}); .green {
width:100px;
height:100px;
background-color:green;
}
#container {
width:500px;
height:500px;
} <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div class="editable green"></div>
<div id="container" style = 'background-color:red;'></div>
Stack Overflow用户
发布于 2016-10-30 11:05:26
您的代码很好，只需为您的DIV #green、#container和.editable调整CSS即可。因为你的DIV's是隐形的。
<div id="green" class="editable"></div>
<div id="container"></div>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/40328286
复制相关文章
相似问题
腾讯云开发者
