Jquery UI拖拽选择项目是一个可拖拽的

Jquery UI draggable select item to be a draggable

本文关键字:一个 UI 选择 项目 Jquery      更新时间:2023-09-26

我有以下html代码:

<div id="match_task_elements_31" class="match_task_draggables ui-draggable">
   <span class="match_task_draggable" id="match_task_draggable_17">Dach</span>
   <span class="match_task_draggable" id="match_task_draggable_16">Tschüss</span>
</div>

现在我想让每个span都是可拖放的对象可以拖放

我试过这个JS代码:

$(".match_task_draggables").draggable({handle : '.match_task_draggable'});

但是整个div和类match_task_draggables是一个块我可以拖放

怎么了?

尝试以下操作。它允许拖放span

$(function() {
  $(".match_task_draggable").draggable();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<div id="match_task_elements_31" class="match_task_draggables ui-draggable">
  <span class="match_task_draggable" id="match_task_draggable_17">Dach</span>
  <span class="match_task_draggable" id="match_task_draggable_16">Tschüss</span>
</div>