javascript - JQuery 拖放

Question

我希望创建一个界面来使用拖放而不是答案附近的复选框来选择多个答案。用户可以选择两种类型的答案(真实答案和假答案)。用户的答案页面上有两张图像(真实图像和假图像)。用户可以将图像拖放到所选答案附近。可以通过移动“图像并放在其他答案上”来更改选择。

我在所有答案附近使用了“用图像格式化的div”，因此用户可以将图像(即假图像或真实图像)放在这个“div”上。

我使用 JQuery 移动“图像”并将其放在“div”上。现在我需要将代码添加到“div”(即用于保存图像的容器)中，以识别哪个“图像放置在其上”，即“假的或真实的”。

Answer 1

现在，您的代码使 #move1 和 #move2 可以拖动，但不能放置。试试这个:

$(document).ready(function(){
    $('#move1').draggable();
    $('#move2').draggable();
    $('form div').droppable({
        drop: function(e, ui) {
            alert(ui.draggable[0].id + ' dropped on ' + this.id);
            //example alert: "move1 dropped on name2"
        }
    });
});