jquery ui drop helper

Ala*_*law 4 jquery drag-and-drop jquery-ui jquery-ui-draggable

使用jQuery和Jquery UI,我有一个可拖动和可放置区域,可拖动项目有以下帮助器

  $(".draggable").draggable({
    revert: 'invalid',
    grid: [ 20,20 ],
    cursorAt: { top: -12, left: -20 },
    helper: function(event) {
      return $('<div class="helper"></div>');
    }
  });
Run Code Online (Sandbox Code Playgroud)

如何让助手进入可added投放区域?

Ala*_*law 6

经过一番调查和另一个问题,我已经解决了这个问题.

dropdroppable元素的事件中,您需要克隆帮助程序,因为您无法删除拖动期间显示的实际帮助程序.

$("#droppable").droppable({
  drop: function(event, ui) {
    var newDiv = $(ui.helper).clone(false)
      .removeClass('ui-draggable-dragging')
      .css({position:'absolute', left:0, top:ui.offset.top - 12});
    $(this).append(newDiv);
  }
});
Run Code Online (Sandbox Code Playgroud)

还要谢谢Jason Benson.

艾伦