我有一个 jquery 示例，可拖动的 div 在起始位置“向左浮动”(= 刷新谷歌浏览器)。当我将它们拖到任何可放置的 div 时，“向左浮动”永远消失了。
我的目标是，可拖动的 div 应该始终在起始位置“向左浮动”。在其他可放置的 div 上，它们可以有任何 float 对齐方式，这无关紧要。
我该如何解决这个问题？
$(function() {
$(".ui-widget-content").draggable({
revertDuration : 100,
revert : function(event, ui) {
$(this).data("uiDraggable").originalPosition = {
top : 0,
left : 0
};
return !event;
}
});
$("#droppable").droppable({
drop: function(ev, ui) {
$(ui.draggable).detach().css({top: 0,left: 0}).appendTo(this);
}
});
$("#parent").droppable({
drop: function(ev, ui) {
$(ui.draggable).detach().css({top: 0,left: 0}).appendTo(this);
}
});
});
<style>
div .floatleft {
float:left;
}
.clearBoth {
clear:both;
}
</style>
</head>
<!DOCTYPE html>
<html>
<head>
<link href = "https://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css"
rel = "stylesheet">
<script src = "https://code.jquery.com/jquery-1.10.2.js"></script>
<script src = "https://code.jquery.com/ui/1.10.4/jquery-ui.js">
</script>
</head>
<body>
<div id="parent" class="ui-widget ui-state-default">
<p>droppable foat left (start position)</p>
<div id="origin" class="floatleft">
<div id="draggable" class="ui-widget-content">
<p>draggable 1</p>
</div>
</div>
<div id="origin2" class="floatleft">
<div id="draggable2" class="ui-widget-content">
<p>draggable 2</p>
</div>
</div>
</div>
</div>
<br class="clearBoth" />
<div id="droppable" class="ui-widget-header">
<p>other droppable</p>
</div>
</body>
</html>最佳答案
关键是你把 p-Tag 拖走了，留下了 <div id="origin" class=floatleft></div>超过。当你把它拉回来时，你不会把它拉到那些 div 里面，因此它们不会得到 float: left。应用了 CSS。
我的建议是更改 css:
#parent p{
float:left;
}
我觉得应该这样
关于jquery - 可拖动的 div 在被放下后会丢失其 "float left"属性，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/52478781/