如何解决如何创建一次只能接受一个的可拖动div
我正在尝试制作一个使用基本块编码的应用程序。 我该如何做,使其一次只能接受一个可拖动对象?并检测“编辑器” div中的可拖动对象是什么?
这是我目前所在的位置(忽略CSS,使用完整的信息中心看起来更好): https://jsfiddle.net/mdv16tqh/ 有人帮忙吗?
HTML
<script type="text/javascript" src="https://code.jquery.com/jquery-1.5.2.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.js"></script>
<div class="colum">
<div class="selection1">
<div class="selection1-button" onclick="S1()">
<!-- ICON -->
</div>
<div id="selection1-section" class="selection1-section">
<div id="launchPad">
<div style="top: 7%;" class="card"><h3 class="elem1text">WARMUP_AND_COOLDOWN</h3></div>
<div style="top: 14%;" class="card"><h3 class="elem1text">RUN_COMMAND</h3></div>
<div style="top: 21%;" class="card"><h3 class="elem1text">TEXT</h3></div>
<div style="top: 28%;" class="card"><h3 class="elem1text">BROADCAST_TEXT</h3></div>
<div style="top: 35%;" class="card"><h3 class="elem1text">ANVIL_GUI</h3></div>
</div>
</div>
</div>
</div>
<div class="editor">
<div class="text-editor">
<div id="dropZone">
<div class="stack">
<div class="stackDrop1"></div>
</div>
</div>
</div>
</div>
JS
$("#launchPad").height($(window).height());
$(".card").draggable({
cursor: "move",helper: 'clone',});
$("#launchPad").droppable({
accept: ".card",drop: function(event,ui) {
$("#launchPad").append($(ui.draggable));
}
});
$(".stackDrop1").droppable({
accept: ".card",ui) {
$(this).append($(ui.draggable));
}
});
谢谢!
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。