Question

每个人，我有一个拖放游戏，在掉线后，他们可以在空白或顶部的任何地方互换。如何正确地做到没有冲突？

让我解释一下游戏的玩法。有三可拨打电话空白1，空白2，空白3 和六可拖动电话< b> ans1 到 ans6 位于视图顶部。

拖动 no.3 图像时，每个空白都可以删除 2 拖动图像，它将交换您已经删除的拖动图像。我不能发布所有的拖放代码，因为它是如此之大。但在删掉2张图片后，我写道：

if( $(this).closest( "div" ).find('img').length == 2 ){ // if the blank already have 2 images
  initDroppable($(".ui-drop img, .ui-drag img"));
  initDraggable($(".ui-drag img, .ui-drop img"));

    function initDraggable($elements) {
      $elements.draggable({
         appendTo: ".blank",
         helper: "clone",
         revert: "invalid"
      });
    }

    function initDroppable($elements) {
      $elements.droppable({
            drop: function(event, ui) {                         
               if( !ui.draggable.hasClass('accept') && $(this).attr('attr') != attr ){ // if not drag from the top & not allowed to drag the same image

                   var old_attr = $(this).attr('attr');
                   var drag1 = $(this).after(ui.draggable.clone()); //this image want to drag
                   var drag2 = $(ui.draggable).after($(this).clone()); // this image have to swap
                   $(ui.draggable).remove();
                   $(this).remove();
                   initDroppable($(".ui-drop img, .ui-drag img"));
                   initDraggable($(".ui-drag img, .ui-drop img"));

               } else { // drag from the top of the view

                   var old_id = $(this).attr('id');
                   var old_drag_id = '';
                   old_drag_id = old_id.replace('d_','').replace(/_clone/,'');
                   $('#'+old_drag_id).show(); // show the image on top of the view
                   $('#'+old_id).remove(); // remove one of that drop image inside the blank
               }
            }
      });
    }
}

我的问题是第一个交换图像总是粘在另一个图像上，我认为这是另一个拖放的冲突。你们有经验做两次拖放吗？我不知道如何修复这个bug。请帮忙。

拖放后，在droppable内，再拖放一下

0 个答案: