jQuery Disable/Enable 的 Droppable/Draggable 状态

Question

昨天我已经厌倦了解释这一点，但我认为人们不理解它。 我将代码和示例发布在http://www.whatevercorp.com/problem/

我已经有一段时间没有使用 jQuery 了，但是到处搜索禁用（'启用'）/禁用示例或动态更改可放置状态的方法。

基本上我有两个问题：

1. 如何更改或限制 .drop 类以仅接受 div 中的 1 项 如果您查看示例（whatevercorp.com/problem/），您会发现您可以在 div 中放置 2 个项目并且它变得很时髦。我只是想限制它，因为它是一个照片库。

2. 如何跟踪表格中的所有 droppble 项目。我希望用户一旦将它们放入盒子中就能够移动它们，而且还要跟踪每个移动。我研究了序列化，但需要一些指针。

希望这可以解决问题，我可以启动并运行此工具。提前感谢您的帮助！

Answer 1

要防止多张图片落入一个 div.drop，试试这个：

$(".drop").droppable({
    accept: ".photo",
    activeClass: 'droppable-active',
    hoverClass: 'droppable-hover',
    drop: function(ev, ui) {
        //returning false will cancel the drop
        if ($(this).children('img').length > 0) return false;

        $(this).append(ui.draggable);   
        $('#output').append($(ui.draggable).attr('src')+"<br />");              
        $('#output').append($(this).attr("id")+"<br />");
    }
});

要跟踪他们的动作，您可能必须使用在上面的 drop 函数中设置的全局变量。