jquery - 在 Jquery/HTML 上实现拖放功能

Question

我需要为我网站上的一个页面创建一个拖放功能，允许用户(一旦登录)将他们喜欢或收藏的图片拖到他们制作的“壁橱”中。我一直在尝试 Jquery draggable，但这不是我想要的工作方式。

这基本上就像您尝试将文件拖到回收站中一样。

• 我希望图像在我放入垃圾箱后消失。
• 我希望系统知道我在其中放入了多少张图片。

这方面的基本方法是什么？我已经动态拉取了我的图片(当用户“喜欢”图片时，它会在壁橱页面中弹出)。我所需要的只是让这个拖放功能正常工作。

Answer 1

你需要的是将你的可拖动对象配置为恢复无效并且你的可放置对象只接受一个可拖动对象然后在放置时你可以执行一个函数并做任何你想做的事情，

<div id="my-draggable"></div>


<div id="my-droppable"></div> 
<script>
    $("#my-draggable").draggable({ revert: "invalid" });
    $("#my-droppable").droppable({ 
        accept: "#my-draggable",
        drop: function( event, ui ) {
            //do whatever you want in here
        } 
});