jQuery draggable: перетаскиваемое перетаскивание только на одном

У меня есть приложение с некоторыми возможностями перетаскивания и перетаскивания, и я хочу сделать для одного типа перетаскивания (с данным классом) это перетаскивание может быть отброшено только для одного типа перетаскивания.

Проблема в том, что это зависит от класса, в начале можно перетаскивать перетаскиваемый элемент в моей сетке:

 $('.grid-drop').droppable({
        accept: '.block',
        hoverClass: 'hovered',
        drop: handlePublishBlock
 });

Итак, что я делаю, когда начинаю перетаскивать свой элемент, я изменяю принятие моей сетки следующим образом:

$('.grid-drop').droppable({
       accept: '.unknown-class',
       hoverClass: 'hovered',
       drop: handlePublishBlock
});

Но, похоже, это не работает, я все еще могу перетащить свой элемент на сетку.

Я хочу сделать так, чтобы элемент с этим классом можно было перетаскивать только на одну каплю, а после этого его нельзя перетаскивать в другой раз, так что вот мой фактический код:

 $(".draggable-one")
        .mousedown(function() {
            $('.grid-drop').droppable({
                accept: '.unknown-class',
                hoverClass: 'hovered',
                drop: handlePublishBlock
            });

            console.log("mousedown");
            isDragging = false;
        })
        .mousemove(function() {
            console.log("mousemove");
            isDragging = true;
        })
        .mouseup(function() {
            console.log("mouseup");
            var wasDragging = isDragging;
            isDragging = false;
            if (wasDragging) {

                $('.grid-drop').droppable({
                    accept: '.block',
                    hoverClass: 'hovered',
                    drop: handlePublishBlock
                });


                $(this).draggable('disable');
                $(this).removeClass('block-draggable');
            }
        });

Когда я начинаю перетаскивать, я отключаю перетаскивание на моей сетке (но, кажется, не работает), и когда я перетаскиваю на другое поле, кроме сетки (есть только одно другое поле), элемент не может быть перетащен в другой раз. Это работает, но отключение и повторное включение сетки не работает.

Может кто-нибудь мне помочь? Благодарю.

1 ответ

Не видя ваш полный код, трудно помочь. Я бы посоветовал что-то вроде этого:

$(function(){
  var $grid = $('.grid-drop').droppable({
    accept: '.block',
    hoverClass: 'hovered',
    drop: handlePublishBlock
  });
  var isDragging = false;
  $(".draggable-one").draggable({
    start: function(e, ui){
      $grid.droppable("option", "accept", ".draggable-one");
      console.log(e.type);
      isDragging = true;
    },
    stop: function(e, ui){
      $grid.droppable("option", "accept", ".block");
      console.log(e.type);
      isDragging = false;
    }
  });
});
Другие вопросы по тегам