Javascript 使用.css移动对象后，重置所有可拖放项以允许拖放

所以我有多个可拖动和多个可拖放。当所有的下拉菜单中都有一个可拖动菜单时，它会运行一个函数，允许用户重置页面。目前，这只是使用jQuery.css函数来更改顶部和左侧的css。如何使可拖放字段再次可拖放

也就是说，我想要一个for循环在每个dropable上使用$（this）

$('.planets').draggable({
    opacity: .4,
    create: function(){$(this).data('position',$(this).position())},
    cursorAt:{left:15},
    cursor:'move',
    start:function(){$(this).stop(true,true)},
    revert : 'invalid'
});

$('.targets').droppable({
  drop: function( event, ui ) {
    if(!$(this).hasClass('dropped-highlight')){
        $( this ).addClass( "dropped-highlight" );
        $(this).droppable('option', 'accept', ui.draggable);
    }
  },
  out: function( event, ui ) {
    $(this).droppable('option', 'accept', '.planets');
    $(this).removeClass( "dropped-highlight" );
  }
});

---

然后，还有一个不同的功能，如果拖动对象单击重置按钮，则会更改其顶部和左侧。

根据您的代码，您似乎只使用了“dropped highlight”类的存在来指示其中一颗行星已落在目标上

您应该能够从每个目标中删除该类，以重新启用其“可拖放”状态：

$('.targets').removeClass('dropped-highlight');

---

你能告诉我们到目前为止你有什么吗？我已经用代码更新了它，很抱歉我试图进行一些编辑，但忘记添加它。drop中还有一行：

$（this）.dropable（'option'，'accept'，ui.draggable）和这行输入输出：
$（this）.droppable（'option'，'accept'，'.plants'）这就是阻止它们实际被放回下拉列表的原因。