如何知道可拖动的类别

Question

我正在尝试获取已被拖动的班级名称。功能在下面给出。

。draggable，edit_draggable，这是类

$(function() {
  $('.draggable').draggable({
    revert: "invalid",
    stack: "0",
    helper: 'clone'
  });

  $('.edit_draggable').draggable({
    revert: "true",
    stack: "0"
  });

  $('.droppable').droppable({
    accept: ".edit_draggable,.draggable",
    drop: function(event, ui) {
      $(this).find("input").remove();
      var droppable = $(this);
      var draggable = ui.draggable;
      draggable.clone().appendTo(droppable);

      $(this).find("input").attr("name", "headercols[]");
    }
  });
});

Answer 1

您可以为drag设置的draggable属性提供功能。开始拖动时将运行此功能。您可以从该函数中的ui参数获取对拖动元素的引用。试试这个：

$("#draggable").draggable({
  start: function(e, ui) {
    console.log(ui.helper.attr('id'));
    console.log(ui.helper.attr('class'));
  }
});

<script type="text/javascript" src="//code.jquery.com/jquery-3.4.1.js"></script>
<link rel="stylesheet" type="text/css" href="/css/normalize.css">
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.12.0/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.12.0/themes/overcast/jquery-ui.css">
<div id="draggable" class="foo ui-widget-content">
  <p>Drag me around</p>
</div>