1

提案されたアイテムをドラッグすると、クローンヘルパーがドラッグされ、元のオブジェクトはその場所に残りますが、後で再度ドラッグすることはできません。同じオブジェクトを2回ドラッグできるようにする必要がありますが、どうすればよいですか?

$('.drag').draggable({
helper: 'clone',
snap: '.drop',
grid: [60, 60],
revert: function(droppable) {
    if (droppable === false) {
        return true;
    }
    else {
        return false;
    }
}
});

 $('.drop').droppable({
     drop: function(event, ui) {
        ui.draggable.fadeOut(1000);
     }
});

$('.drag').hover(
  function() {
    $(this).stop().animate({
    opacity: "0.8"
    });
}, function() {
    $(this).stop().animate({
        opacity: "1"
    });
});

$('.drop').droppable({
    drop: function(event, ui) {
        if (ui.draggable[10, 10].id) {
            $(this).append($(ui.helper).clone().draggable());
        }
    }
});
4

1 に答える 1

3

動作するコードのjsfiddleは次のとおりです。

http://jsfiddle.net/qfywP/2/

問題はこの行にありました:

$(this).append($(ui.helper).clone().draggable())

最初にヘルパーのクローンを作成し、それをDOMに追加してから、ドラッグ可能にする必要があります。

ui.helper.clone().appendTo($(this)).draggable()

また、コードがifステートメントでラップされていることにも注意してくださいif (ui.draggable[10, 10].id) {}。これはtrueを返さなかったため、コードは実行されませんでした。

また、冗長性があるため、コードの春の大掃除も行いました。$('.drop').droppable()必要なのは1回だけだったのに、2回宣言されていました。

于 2012-07-27T03:37:04.820 に答える