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"
        }
    });
});